Smooth scrolling for Script.aculo.us

From time to time while developing with script.aculo.us I needed smooth scrolling for an “overflow:auto” element:

finally I got it: http://dev.rubyonrails.org/ticket/5118

If you want to scroll to a specific element inside the container, follow this example:

function moveTo(container, element){
  Position.prepare();
  container_y = Position.cumulativeOffset($(container))[1]
  element_y = Position.cumulativeOffset($(element))[1]
  new Effect.Scroll(container, {x:0, y:(element_y-container_y)});
  return false;
}

where Position.cumulativeOffset($('target-id')) gives you an array with the absolute position of that element.

UPDATE the Source: If you’re looking for the source code of Effect.Scroll just click here …effectively the diff file is not so easy to work with (thank you Paul).

UPDATE/2 an Example:
Here’s the EXAMPLE. (Thank you for the advice Andreas)

UPDATE/3 get Horizontal: (after Ronnie’s comment)
Some guys did a very good work and got something similar to the Panic’s Coda website.
Visit Glider.js website to download the source.