0

Olá, gostaria de saber como defino uma localização aonde o efeito de scroll de site one page deve parar. O problema que enfrento é que ao dar um click em um dos links do meu menu de navegação no cabeçalho o scroll automático deslocasse até o conteúdo desejado mas corta partes do mesmo como o titulo do conteúdo, como defino aonde ele deve parar.

O click no link do conteudo

O erro

O resultado desejado

peço q observem com atenção por ser uma pergunta bem elaborada.

1
  • Isso acontece pq sua navbar está com posítion:fixed poste seu código completo que fica mais fácil de te ajudar.
    – hugocsl
    2/04/2018 às 19:12

1 Resposta 1

0

Na posição final que você passa pra função do animate, precisa subtrair a altura desse cabeçalho fixo. Ou seja, a coordenada vai ser a posiçãoDoConteúdo - alturaDoHeader.

Por exemplo:

$("html, body").animate({ 
    scrollTop: $(#sobre-nos).offset().top - $('#topo').outerHeight() 
}, 1000);
6
  • vou testar ja te falo se deu certo
    – loser
    2/04/2018 às 19:36
  • jQuery(document).ready(function($) { $(".scroll").click(function(event){ event.preventDefault(); $('html,body').animate({scrollTop:$(this.hash).offset().top}, 1000); }); });
    – loser
    2/04/2018 às 19:43
  • este e o código
    – loser
    2/04/2018 às 19:44
  • aonde devo fazer a alteração
    – loser
    2/04/2018 às 19:44
  • {scrollTop:$(this.hash).offset().top - 100}, Troca o "100" pela altura do header.
    – Afonso
    2/04/2018 às 19:59

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .