У меня странная проблема.На мобильном сайте я должен отображать изображения во всплывающем окне, когда пользователь нажимает на ссылку.Для этого выполняются следующие шаги:
- Отображается всплывающий элемент div (отображается состояние «загрузка ...»)
- данные извлекаются из запросов Ajax,
- создается в соответствии с данными и добавляется в контейнер div (
$('#container').html('<img src="https://example.com/image.jpg">');) - вертикальная позиция div корректируется, чтобы изображение оставалось по центру экрана
Дляшаг 4, событие «load» прикрепляется к изображению после его добавления в контейнер div, поскольку изображение должно быть загружено (и отображено), чтобы узнать, как настроить div контейнера (его положение зависит от высоты изображения).this.complete также проверяется, чтобы принудительно запускать загрузку, если изображение находится в кеше.
Это хорошо работает на настольных компьютерах, устройствах Android, но не на iPhone.Отладка и добавление многословия, чтобы знать, когда происходят события, я заметил, что событие «load» запускается на iPhone до того, как изображение фактически загружается и отображается (или пространство, зарезервированное в DOM в случае прогрессивного отображения JPEG).Таким образом, когда я пытаюсь центрировать контейнерный элемент div, его высота уже не изменилась, а центрирующее усилие не удается, контейнерный блок остается вне центра.
Я проверил, будет ли какое-либо взаимодействие с this.completeпроверка и дело не в этом: убран принудительный запуск load ничего не меняет.Событие load фактически запускается Safari.
Вы уже сталкивались с этой ситуацией?Любая идея Как я мог это исправить?
Спасибо.
- Макс.