1

deem uma olhada nesse link Fun Wake Park cliquem no menu e vão perceber que antes de acontecer o efeito de deslize, a pagina vai ate o destino e volta rapidão dando uma piscada, o que pode ser isso ? Estou usando o jquery.easing, mandaram eu usar o ScrollTo do Tweenmax mas achei complicado não entendi como se aplica.

Podem me ajudar com essa ?

Código que chama o plugin:

$(function() {
$('a').bind('click',function(event){
    var $anchor = $(this);

  $('html, body').stop().animate({scrollTop: $($anchor.attr('href')).offset().top}, 2000,'easeInOutExpo');

 });

});

4
  • 1
    O JS na página está todo minificado... dificil ajudar. Parece-me um FOUC mas a ágina não está a carregar... testa event.preventDefault() para evitar que o browser faça scroll e no milisegundo depois vem o animate do jQuery.
    – Sergio
    4/10/2015 às 4:30
  • Através do que vc flw fui pesquisar, e testei adicionar um return false; na função e aparentemente testando no local deu certo. Obrigado
    – user27585
    4/10/2015 às 13:48
  • E testaste com event.preventDefault()?
    – Sergio
    4/10/2015 às 13:50
  • Testei sim, não sei se fiz errado mas acabou n dando certo, somente o return deu certo.
    – user27585
    4/10/2015 às 14:39

1 Resposta 1

0

Penso que o problema é não estares a parar o evento.

Quando clicas numa âncora o browser vai abrir numa página nova, ou saltar para o ponto da página. Se usares uma url ele vai para uma nova página, se usares #id ele vai para uma certa posição onde encontra esse elemento dentro da mesma página.

Uma vez que esse comportamento não é parado, o browser vai para esse sitio da página e ao mesmo tempo começa um scroll. Isso baralha e dá esse efeito.

Se a minha teoria estiver certa (pois não consigo testar no teu site) precisar parar o evento. E isso podes fazer assim:

$(function() {
    $('a').bind('click',function(event){
        event.preventDefault(); // ou return false no final desta função
        var $anchor = $(this);
        $('html, body').stop().animate({scrollTop:$($anchor.attr('href')).offset().top}, 2000,'easeInOutExpo');
    });
});
1
  • Foi exatamente o que fiz seguindo sua linha de raciocínio fui pesquisar, e testei o return:false; e deu certo, ja sub o projeto pro ar de uma olhada. muito obrigado
    – user27585
    4/10/2015 às 14:38

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