Search code examples
jqueryformsipadscrollsafari

Disable scrolling when changing focus form elements ipad web app


I have a web app. I'm trying to disable/prevent the scrolling that occurs when you focus on different form inputs (i.e. the scrolling that occurs as you advance through input elements in a form).

I've already disabled scrolling with this:

 <script type="text/javascript">
     $(document).ready(function() {
         document.ontouchmove = function(e){
              e.preventDefault();
              }
     });
 </script>

To add a little more info - I have a few "slides" that my page consists of. Each are 768x1024 and they are "stacked" on the page (i.e. the page is 768x3072 [1024*3=3072]) and when you click a link I'm using scrollTo jquery plugin to scroll to the next "slide" and .focus() on an input element.

Does anyone know how to do this?


Solution

  • I've found that in UIWebView, document.body is also sometimes moved. So I use:

        input.onfocus = function () {
            window.scrollTo(0, 0);
            document.body.scrollTop = 0;
        }