Scrolling with jQuery when scrolling is disabled on CSS

I would like to scroll the page using a jQuery animation yet the scrolling is disabled in the CSS & it doesn’t allow the animation to take place:

Here’s the fiddle:

If you set overflow:hidden, the scroll event doesn’t happen. So you can’t trigger it using the animation either. And really, what’s the point of animating a scroll if the user can’t scroll anyway :p

One solution is to wrap the content in another container & animate the container instead, like this:



And the Javascript: