CODEWITHSUNDEEP
jqueryanimationjquery-animatescrollto
AnApprentice
AnApprentice

Reputation: 111040

JQUERY, scrollTo, after scrolling down, the page won't let me scroll up for a second... Y?

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?

Upvotes: 1

Views: 2319

Answers (3)

Jason Nelligan
Jason Nelligan

Reputation: 1

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

Upvotes: 0

Frogy Diak
Frogy Diak

Reputation: 53

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;
});

Upvotes: 3

stagas
stagas

Reputation: 4793

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.

Upvotes: 3

Related Questions