Изменение масштаба (уменьшения) области просмотра работает только один раз
У меня проблема с масштабированием iPad.
При щелчке пользователь должен получить всплывающее окно с наложением, и представление не должно масштабироваться - это означает, что оно должно уменьшаться до масштаба 0,75 (в основном, уменьшать масштаб до максимально возможного). Поэтому я применяю этот код jQuery к окну просмотра:
$('meta[name="viewport"]').attr('content', 'width=1020, height=device-height, initial-scale=0.75, minimum-scale=0.75, maximum-scale=0.75, user-scalable=no');
И при закрытии я сбрасываю тоже исходные значения, чтобы включить масштабирование. Вроде такой:
$('meta[name="viewport"]').attr('content', 'width=1020');
Итак, чтобы переписать
- Пользователь заходит на страницу, имеет начальное содержимое окна просмотра ширина =1020
- Пользователь щелкает элемент, вызывающий всплывающее окно, пользователь может увеличить масштаб на странице
- Всплывающее событие изменяет содержимое области просмотра, поэтому оно уменьшается до 0,75 [кодовый блок #1]
- Когда всплывающее окно закрыто, содержимое области просмотра сбрасывается [кодовый блок #2]
Это работает нормально, пока пользователь не выполнит одно масштабное действие ПОСЛЕ первого изменения области просмотра и снова не вызовет всплывающее событие. Тогда примененные атрибуты области просмотра не вступят в силу, они останутся увеличенными вместо масштаба 0,75.
TLDR: масштабирование окна просмотра работает только один раз:)
Добавляется больше кода:
$('body').on('click', '#large-image', function() {
$('meta[name="viewport"]').attr('content', 'width=1020, height=device-height, initial-scale=0.75, minimum-scale=0.75, maximum-scale=0.75, user-scalable=no');
// HERE GOES CODE THAT CREATES A FIXED DIV WITH 100% IN BOTH HEIGHT AND WIDTH
});
$('body').on('click', '#zoomPinchClose', function() {
// REMOVE THE FIXED DIV
$('meta[name="viewport"]').attr('content', 'width=1020');
});
Вот и все. Нет укладки для тела. Создается только растянутый фиксированный div.
1 ответ
Хватаясь за соломинку здесь, но попробуйте это
$('body').on('click', '#zoomPinchClose', function() {
// REMOVE THE FIXED DIV
$('meta[name="viewport"]').removeAttr("content");
$('meta[name="viewport"]').attr('content', 'width=1020');
});