Как отключить подпрыгивание в полноэкранном приложении html5 для iphone?

Question

Я хочу сделать html5 полноэкранное приложение.Я сделал страницу и добавил ее в качестве значка на свой iphone.Я добавил метатеги:

 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="black">
 <meta name="viewport" content="width=device-width, user-scalable=no" />

Чего я хотел добиться: черную строку состояния сверху (это не работает, и я не знаю почему. Это по-прежнему строка состояния по умолчанию ... кто-нибудь задумался?)без возможности увеличения (как в приложении Facebook) - это работает отлично.

Теперь проблема - я могу прокручивать на своем iphone, даже если мое приложение помещается на экране.Это приходит в норму, но я не хочу такого поведения.Я хотел бы отключить это и включить прокрутку для определенного div (.ui-content).Как мне этого добиться?

РЕДАКТИРОВАТЬ: строка состояния теперь черная.Это изменилось само по себе через некоторое время.Была ли кеширована предыдущая версия на iphone или как?

Answer 1

Это предотвратит прокрутку на всей странице

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

В вашем случае, когда вы хотите, чтобы некоторые элементы div можно было прокручивать, а некоторые - нет, вы должны иметь возможность перехватить событие, прежде чем оно попадет вдокумент

scrollableDiv.ontouchmove = function(e) {e.stopPropagation()};

Answer 2

Если вы используете Cordova 1.7+, откройте файл Cordova.plist и установите для ключа UIWebViewBounce значение NO

Answer 3

Расширение подхода dmanxii - вот что мы делаем.

    $("body").on("touchmove", function (event) {
        if ($(event.target).is(".WhatEverClass") || $(event.target).parentsUntil().is(".ParentClass")) {
            //console.log("NOT Disabled"); 
        }
        else {
            //console.log("Disabled"); 
            event.preventDefault();
        }
    });