CODEWITHSUNDEEP
jquerycsssmooth-scrolling
Marais Rossouw
Marais Rossouw

Reputation: 957

ScrollTop with height 100% elements

I have a problem guys where I have a single page site, with height 100% elements (so it fits the fold) and i have about 4 of these sections stacked. There is a nav with a anchors that link to relevant sections. I want these to smooth scroll, but for some reason the offset().top returns 0 no matter the element... Is there a way to smooth scroll these? I have tried 3 different libraries, all the same result. As a side note, optimization still needs to accor.

Live version: http://jackaroocaravans.com.au/new/

Upvotes: 0

Views: 1203

Answers (1)

AlliterativeAlice
AlliterativeAlice

Reputation: 12577

The following code works fine for me on your page (for example, for scrolling to the interior section)

jQuery('html, body').animate({
    scrollTop: jQuery("#interior").offset().top
}, 1000);

To bind to anchor tag click events:

jQuery('a[href^="#"]').click(function (e) {
    e.preventDefault();
    jQuery('html, body').animate({
        scrollTop: jQuery(jQuery(this).attr('href')).offset().top
    }, 1000);
    return false;
});

Upvotes: 1

Related Questions