Screen 'blinks' when clicking the menu before sliding to the destination

Question

Screen 'blinks' when clicking the menu before sliding to the destination

Navigation

#1 by (1 votes)

1

Take a look at this link Fun Wake Park click on the menu and you will notice that before the slide effect happens, the page go to the destination and come back quick with a wink, what can this be? I'm using jquery.easing , they told me to use ScrollTo of Tweenmax but I found it complicated I did not understand how it applied.

Can you help me with this one?

Code that calls the plugin:

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

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

 });

});

javascript jquery

asked by anonymous 03.10.2015 / 18:44

1 answer

Given a list of words, return the size of each group of anagrams decreasing [closed] Read a vector up to a stop bit

score 1 · Accepted Answer

I think the problem is you're not stopping the event.

When you click on an anchor the browser will open on a new page, or jump to the point of the page. If you use a url it goes to a new page, if you use #id it goes to a certain position where you find that element within the same page.

Since this behavior is not stopped, the browser goes to that page site and at the same time starts a scroll. This shuffles and gives that effect.

If my theory is right (because I can not test it on your site) you need to stop the event. And you can do this:

$(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');
    });
});