This project is archived and is in readonly mode.

#460 ✓resolved
Aicke Schulz

Improve Fx.Scroll with axes limit

Reported by Aicke Schulz | December 16th, 2010 @ 01:13 PM | in

While using SmoothScroll I did not wanted to scroll horizontal and vertical, but only vertical, down to an anchor. Scrolling on two axes sometimes give ugly page layout experiences and can be confusing / bad for orientation.

My solution is the following toElement() extension. I have to say I made that with MooTools More, where the "scroll = " part isn't included, and I just added the scroll thing after that, without really understanding why it is needed. My solution is working but maybe one can optimize and replace the windows.getScroll part.

toElement: function(el){
 var position =,
     scroll = isBody(this.element) ? {x: 0, y: 0} : this.element.getScroll(),
     positionX = ((this.options.axis == "y") ? window.getScroll().x : position.x) + scroll.x,
     positionY = ((this.options.axis == "x") ? window.getScroll().y : position.y) + scroll.y;
 return this.start(positionX, positionY);

There is one drawback of the axes limit. If the element isn't visible after scrolling, the browser jumps to that element, because that's the normal behavior of the browser when win.location.hash is set. But i don't think thats a KO criteria.

Mabye someone wants to extends the Fx.Scroll toElement() functionality further, so it first scrolls up/down then left/right or vice versa.

Comments and changes to this ticket

Create your profile

Help contribute to this project by taking a few moments to create your personal profile. Create your profile »

The MooTools Extensions

People watching this ticket

Referenced by