прокрутка в iOS div без фиксированной высоты - PullRequest
1 голос
/ 13 января 2012

Я создаю веб-приложение для iOS с фиксированным div (скажем, 200px высота) и содержимым внутри этих прокруток. Мне не нравится прокрутка iOS по умолчанию, так как она не похожа на собственную прокрутку, которую можно найти, просто проведя пальцем по веб-странице (собственная прокрутка в iOS имеет импульс, в то время как по умолчанию для overflow нет импульса).

div, который я пытаюсь прокрутить, обладает следующими качествами:

  1. Ширина набора
  2. Динамическая высота (содержимое через AJAX)

Контент загружается с внешнего веб-сайта в div с использованием jQuery AJAX, и есть возможность перезагрузить запрос AJAX. Это означает, что в зависимости от объема содержимого загруженной страницы высота div будет меняться.

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

  1. - webkit-overflow-scrolling: touch
  2. iScroll

И проблемы с этим:

  1. Это был мой первый выбор, так как это просто тег css, который обычно работает нормально. Это новый продукт, в котором есть много ошибок, в том числе для моего веб-приложения. Если вы focus на элементе input, страница увеличится (даже если для тега meta установлено значение user-scalable:no) и не уменьшит масштаб до тех пор, пока вы не введете текст в текстовое поле, а затем все отключится. на 3px.
  2. Это решение запаздывает, и его высота должна быть фиксированной. Использование функции обновления слишком громоздко, поскольку ее необходимо вызывать при перезагрузке запроса AJAX, при перезагрузке страницы, если элементы скрыты и т. Д.

TL; DR: Существуют ли какие-либо решения, кроме -webkit-overflow-scrolling и iScroll, которые позволят мне использовать прокрутку импульса для div с динамической высотой (контент, загружаемый через AJAX) в iOS?

1 Ответ

1 голос
/ 08 февраля 2012

То, что я сейчас делаю, чтобы преодолеть проблему с динамической высотой, это установка высоты после обновления DOM. Я делаю это с помощью следующего кода:

document.getElementById('content').style.height = window.innerHeight - getPosition('loading')[1] + "px";

В этом примере основным DIV является «контент», и у меня есть интервал прямо над этим DIV, называемый нагрузкой, который он использует в качестве контрольной точки, поскольку размер заголовка изменяется в зависимости от того, в какой части веб-приложения вы находитесь. Ниже приведена функция getPosition:

function getPosition(who){
var e = document.getElementById(who);
var position = {x:0,y:0};
while (e) {
    position.x += e.offsetLeft;
    position.y += e.offsetTop;
    e = e.offsetParent;
}
return [position.x , position.y];};

Кроме того, я считаю, что масштаб был исправлен с iOS 5.0.1.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...