Question

I’m making a webapp for iOS. I want it to be not-scrollable, with the exception of a textarea (that needs to be scroll-able). I’ve tried looking around at similar problems such as this one disable enter key on page, but NOT in textarea without luck (that example looked the most promising, but I got “can’t find variable node” error in Safari).

Can anyone help me with this? Thanks

Didn’t solve my problem but helpful – marked best answer

Answer 1

You could see if the user is trying to scroll (usually one finger moving on the screen indicates a scroll), and using an onTouchMove event Listener, prevent default and propagation.

var element = document.getElementById("textarea");
element.addEventListener("touchmove",function(e){onTouchMove(e)},false);

function onTouchMove(e) {

    if(e.touches.length != 1) return;

    e.stopPropagation();
    e.preventDefault();

}

iDevices are kind of tricky when it comes to scrolling internal elements anyway; usually people are trying to achieve scroll effects on inner elements 🙂