Мобильный сайт предотвращает упругую прокрутку страницы - PullRequest
0 голосов
/ 24 декабря 2011

Я разработал ajax-сайт с фиксированным верхним и нижним колонтитулами и прокручиваемым div в середине, который содержит содержимое приложения. Сайт отлично работает и на мобильных устройствах (iPad, Android и т. Д.), За исключением того факта, что когда пользователь попадает в нижнюю часть среднего прокручиваемого элемента div, в игру вступает упругая прокрутка, а нижняя часть страницы отделяется от нижняя часть экрана. То же самое, когда они достигают верхней части прокручиваемого div.

Я знаю, что вы можете полностью предотвратить упругую прокрутку, выполнив следующие действия:

$('#Platform').bind('touchmove', function (e) {    
   e.preventDefault();    
});

Но это, очевидно, вообще предотвращает прокрутку, и тогда пользователь не может видеть содержимое приложения. Моя мысль состоит в том, чтобы поместить некоторую условную логику в вышеупомянутое событие, чтобы сделать так, чтобы e.preventDefault () вызывался только тогда, когда пользователь находится вверху div И они пытаются прокрутить вверх, или они находятся внизу div И они пытаются прокрутить вниз. Я начал делать что-то вроде этого:

$('#Platform').bind('touchmove', function (e) {
    var platform = $('#Platform');
    if ((platform.scrollTop() + platform.innerHeight()) >= platform[0].scrollHeight) {
        e.preventDefault();
    }
});

Приведенный выше код в основном определяет, находятся ли они в нижней части прокручиваемого элемента div и вызывается ли e.preventDefault (). Это здорово, но как только они достигнут дна, они больше никогда не смогут прокрутить! Я полагаю, что мне нужно каким-то образом определить, каким образом пользователь выполняет считывание, и включить это в мою логику. Если они внизу и скользят вниз, не прокручивайте. Но если они внизу и смахивают вверх, дайте им прокрутить. И наоборот, когда они находятся на вершине дивизиона.

Это лучший способ достичь моей цели? Есть ли способ лучше? Если это то, что я должен сделать, как определить направление удара?

Кроме того, существует ли более простой способ протестировать веб-сайт на устройстве iPad, iPhone, Android, чем развертывание его на сервере разработки? Я бы больше поигрался с предложенным решением, если бы не тот простой способ отладки кода.

Спасибо.

1 Ответ

0 голосов
/ 24 декабря 2011

http://cubiq.org/iscroll-4 отлично подходит для вашего использования.Если у вас есть Mac, вы можете легко отлаживать свои программы, тогда вы просто используете симулятор iPhone / iPad, который вы получаете при загрузке xCode / iPhone SDK.

...