iPad / jQuery.animate(scroll) issues

Question

I have a page that uses jQuery.animate to scroll the body/html of the document, it works fine in browsers but just won't play ball with iPad.

First it is supposed to scroll in the Y direction then X, but on an iPad it scrolls in the Y, then it jumps back to the original position before scrolling in the X direction. After the animations are complete the links that are used to navigate cease to function unless you manually scroll the page, then they will work again!

What am I doing wrong here? The page is found here...

Thanks in advance, Phil.

Answer 1

I figured it out. iOS does not scroll the body, but it moves the viewport. This causes some undesired effects when jQuery tries to interact with it. The solution is to scroll a div instead of the body of the document.

Answer 2

scrollTop() and scrollLeft() aren't supported on iPad. Try window.pageYOffset and window.pageXOffset.

Not sure what is happening with the nav links freezing until manual scroll - but its not just you - I've seen it before.