JQUERY, scrollTo, after scrolling down, the page w

2019-06-06 12:56发布

问题:

I'm using the following JQUERY to attach an even to a link in the header, which essentially scrolls to the bottom of the page:

$('#comment-count-btn').click(function(){
    $('html,body').scrollTo('#comment-wrapper', 500);
});

Problem is, that it scrolls all the way to the bottom of the page (which is correct), but then when I try to scroll up a tad, the scroll bar jumps, as if it's locked for a little bit.

Any ideas?

回答1:

Try adding return false; in the end of click() function. Also, try scrollTo only to the 'body' not both html and body. It maybe confusing scrollTo.



回答2:

Try to trace your click using console.log, most likely your element is being clicked multiple times.

Also, if you have on scroll capturing the position make sure that the on click is outside of the on scroll. That's how I fixed this same issue.

$(window).on('scroll', function()){
    if (scrollTop.length > 0) {
        if ($(this).scrollTop() > 500) {
            scrollTop.fadeIn();
        } else {
            scrollTop.fadeOut();
        }
    }
}

// the click event has to be outside of the scroll event
scrollTopButton.click(function() {
    $("html,body").animate({
        scrollTop: 0
    }, 1000);
    return false;
});


回答3:

Having the click event out of the scroll function worked for me