Javascript / HTML5: Можно ли заставить Safari сохранять текущее положение страницы при загрузке изображений? - PullRequest
0 голосов
/ 21 марта 2012

Справочная информация : я разрабатываю мобильный сайт с потерей изображений, для загрузки которого требуется 3G-соединение.

Конструкция моего мобильного сайта заключается в том, что когда пользователь нажимает на ссылку, страница открывается где-то посередине текста (позиция определяется идентификатором div).

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

На странице с множеством изображений это происходит снова и снова.

Сами изображения являются опубликованными пользователями изображениями со всего Интернета, поэтому ширина и высота изображений не известны заранее (для использования простых атрибутов ширины / высоты в источниках изображений)

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

Показательный пример :

<div id="#p1">
Text text
<img>
<img>
<img>
</div>

<div id="#p2">
Text text
<img>
<img>
<img>
</div>

<div id="#p3">
Text text
<img>
<img>
<img>
</div>

<div id="#p4">
Text text
<img>
<img>
<img>
</div>

Таким образом, если область просмотра начинается по центру в div id # p3 при начальной загрузке страницы, а затем изображения в div # p1 и # p2 начинают медленно заполняться через соединение 3G, Safari просто выталкивает содержимое, чтобы освободить место для изображения, и пользователь теперь смотрит на кучу изображений из div # p2 вместо начального текста div # p3.

Спасибо!

Ответы [ 2 ]

1 голос
/ 21 марта 2012

Простой: Определите ширину и высоту изображения в вашем HTML для каждого изображения. Затем средство визуализации знает, сколько места осталось на отображаемой странице для входящих изображений, и прокрутка не может быть затронута.

Вот как это было решено несколько лет назад, когда все еще имели дозвон.

0 голосов
/ 21 марта 2012

Вы можете попытаться прикрепить события обработчика загрузки к каждому img. Затем, когда IMG загружен, используйте простой оператор if:

- если изображение загружено до текущей позиции прокрутки, отрегулируйте положение прокрутки с помощью $ (img) .height ()

См. Как прокрутить окно с помощью функции JQuery $ .scrollTo ()

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