Search code examples
javascriptmootoolssmooth-scrolling

MooTools onLoad SmoothScrolling (Lim Chee Aun Method)


From the post Lim Chee Un made here: http://davidwalsh.name/mootools-onload-smoothscroll

window.addEvent(‘domready’, function() {
new SmoothScroll({ duration:700 }, window);
var el = window.location.hash.substring(1); // the hash
if(el) {
window.scrollTo(0,0);
var scroll = new Fx.Scroll(window, { wait: false, duration: 700, transition: Fx.Transitions.Quad.easeInOut });
scroll.toElement(el);
}
});

I would like to have the page automatically smooth scroll to the # in the URL when the page loads.

Smooth scrolling works when the link is like this, ie same page:

<a href="#pageHeading">Books & Booklets</a>

Rather than how I need it like this:

<a href="books.html#pageHeading">Books & Booklets</a>

Can anybody shed some light on why this isn't working?

Thanks


Solution

  • Lim Chee Aun was kind enough to post up a solution!

    Example

    Full Code