Comments on: Smooth Scrolling with MooTools Fx.SmoothScroll

By: Ed

Ed — Tue, 05 Jul 2011 19:06:00 +0000

Hi David,
I’m having a slight issue with the script. It works beautifully until spaces are introduced into the anchor then it switches to the browsers default method. Any idea of a work around for this? I’m generating my anchor id from the title of wordpress blog posts so occasionally there’ll be a space in there.

By: David

David — Wed, 23 Feb 2011 19:22:04 +0000

I give up. Wrapping my code in the specified code tag or otherwise does not seem to work for me.

By: David

David — Wed, 23 Feb 2011 19:20:45 +0000

I’ll try this one more time:

header code:

src=”js/mootools-core-1.3.js”>
src=”js/mootools-more.js”>

new Fx.SmoothScroll({
duration: 800
},window);

Body code:

Inventions

info

By: David

David — Wed, 23 Feb 2011 19:16:24 +0000

Oh dear, not sure if that code is displaying correctly. I’ll try it without the tags.

The code I’m using in the header of my page:

new Fx.SmoothScroll({
duration: 800
},window);

And the body:

info

By: David

David — Wed, 23 Feb 2011 19:11:20 +0000

Hi David,

for the life of me I can’t get this to work. Any help would be appreciated.

The code I’m using in the header of my page:

new Fx.SmoothScroll({ duration: 800 },window);

And the body:

…

info

The anchor works correctly, but without the smoothness. It’s probably something small and idiotic I’ve left out.

Regards,
David.

By: Pier Luigi

Pier Luigi — Sun, 21 Nov 2010 10:15:45 +0000

Hi David,
I’ve discovered a bug with Safari (at least with latest 5.0.3) that prevent your anchor matching algorithm to work.
To see the bug simply put your demo page inside a folder with a space (or other url special chars) into the name: in those cases, Safari report links.href in url-encoded format but location.href in plain string format so the match never occurs.

For example: with a file testsmoothscroll.html inside a folder “spaced name folder”

links.href = file:///spaced%20name%20folder/testsmoothscroll.html
location.href = file:///spaced name folder/testsmoothscroll.html

Bye.

By: Tetsuo

Tetsuo — Wed, 13 Oct 2010 09:47:59 +0000

David, in your example, you don’t need to create empty anchor tags – you can simply place the id on the element you want to target (eg. h2) and also do away with the “name” attribute.

It’s a shame you can’t apply transitions for SmoothScroll for Mootools 1.12. It was possible to do this in v1.11, and I think that was better and more flexible in that sense, than it is now :(

By: Jenny

Jenny — Wed, 09 Jun 2010 03:01:33 +0000

I got it to work, you can disgard the previous post. : )

By: Jenny

Jenny — Wed, 09 Jun 2010 02:52:41 +0000

Hello David,

I am having some problems with this. It is working fine in all other browser except IE, however for some reason the one that you have is working.
I am not sure if I am missing something. Can you please take a look at my website and let me know what is going on?

Thanks in advance!!

By: Michael

Michael — Mon, 07 Jun 2010 08:41:05 +0000

@jorge luis: According to a post of the google-group of mootools this is not possible as smoothScroll only targets the browser-window. You’ve got to use fx.scroll instead.