Question

I have a site for ipads and when they click on a certain page they are supposed to input their email. When they open, it automatically onfocuses to the input and the keyboard is brought up. The content of my page is only 373px because that is the viewable area above the keyboard. I’d like to prevent people from scrolling down below that point. Any ideas? Something that automatically scrolls them back when they try and scroll down..? Thanks

For further details: What I have is one page with 3 “slides”. The first is 768px tall, when they click “enter your email to sign up” it takes them to slide 2. This is the slide I want to be only 373px tall and prevent scrolling. I’ve tried $('#container').scrollTo( '768px', 500 ).css("height", "373px");… this sets the height, but you’re still able to scroll down and it just shows a big white box.

Thanks!

Answer 1

I ended up make my page 768×1024 and disabling all scrolling (which is what I really wanted anyway) using this:

    $(document).ready(function() {
        document.ontouchmove = function(e){
             e.preventDefault();
             }
    });