JS / overflow: скрытые проблемы с производительностью в Safari на iPad / iOS - PullRequest
7 голосов
/ 14 сентября 2010

Я работаю в Google Maps-подобной системе прокрутки / панорамирования.Предполагается, что система намного проще, чем «оригинал» (без масштабирования), и поэтому она построена довольно простым способом:

  • Существует содержащий div, представляющий область просмотра с установленным переполнениемскрытому и фиксированному размеру
  • Этот div содержит еще один div, который панорамируется на основе движения мыши
  • В зависимости от видимой области фиксированные div (или imgs) добавляются в div панорамирования дляотображать части очень большого изображения

Эта установка работает так, как и должна.Особенно в обычных браузерах на десктопах он работает без нареканий.Прокрутка плавная.

Не так много на iPad, хотя: здесь все кажется очень вялым.При панорамировании наблюдается заметная задержка, и для регистрации щелчков требуется очень много времени.

Для начала работы с сенсорными интерфейсами мне сначала пришлось «преобразовать» события касания в события мыши.Хотя без этого сложно проверить разницу в производительности, я считаю, что это не является причиной проблемы, поскольку при ее отключении реагирование на простые щелчки остается одинаково низким.

Я попытался выяснить, что может быть причиной этого, кратко рассмотрев сам Google Maps (который работает так же хорошо на iPad, как и везде), но безрезультатно (просто слишкомСложно получить быстрое представление).Поэтому, в конце концов, я думаю, что это может быть связано с тем, как мобильный Safari обрабатывает элементы div в контейнере с установленным значением «переполнение: скрытый», некоторыми проблемами с кэшированием или необходимыми JS-трюками, о которых я не знаю.

Есть идеи, где я мог бы начать искать?

1 Ответ

3 голосов
/ 20 сентября 2010
Переполнение

может быть проблемой для производительности.Вы должны попробовать z-index.

Подумайте о 5 делениях, расположенных как (внизу, слева, в центре, справа и сверху)

установите z-index центра в 1, а другие в 2 так,это будет работать как переполнение: назначено скрытое свойство.

пожалуйста, не так;Вы должны задать цвет фона для div с z-index 2, чтобы области переполнения были скрыты от центрального div.

Надеюсь, это сработает!

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