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:
$('html, body').css({ 'overflow': 'hidden', 'height': '100%'});$('html, body').animate({ scrollTop: 939}, 2500);
Here’s the fiddle: http://jsfiddle.net/AKPHB/1/
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:
Demo: http://jsfiddle.net/AKPHB/10/
<div id="content"> <div class="text">text</div> <div class="text">text</div></div>
CSS:
#content{position:relative}
And the Javascript:
$('#content').animate({ top: -939 });
No comments:
Post a Comment