Мне нужно, чтобы собственный жест масштабирования в мобильных браузерах вел себя как настоящее масштабирование браузера: когда пользователь сводит пальцы, медиа-запросы должны пересчитываться, а макет должен перекомпоновываться. В то же время горизонтальная прокрутка должна оставаться отключенной (чтобы ширина области просмотра оставалась фиксированной).
Проблема, с которой я столкнулся:
В мобильных браузерах масштабирование рассматривается как лупа. Макет остается фиксированным; медиа-запросы не срабатывают.
Прослушивание VisualViewport.resize и ручное масштабирование элементов делает их больше, но по-прежнему вызывает горизонтальную прокрутку.
Я могу обойти это, установив html {position: fix; , перехват событий указателя, установка переменных CSS и принудительное перекомпонование. Однако я смогу заставить его работать, только если отключу вертикальную прокрутку (
overflow: hidden). В тот момент, когда я разрешаю вертикальную прокрутку, возвращается исходное поведение.
[*]Чтобы сохранить настраиваемый масштаб, мне приходится блокировать сенсорное действие
на корневом элементе, что по сути отключает встроенное сжатие. Это похоже на нарушение специальных возможностей (WCAG 1.4.4).
Итак, вопрос в следующем: Имеет ли смысл выпускать такое пользовательское масштабирование, если основная цель – сохранить доступность страницы? Существует ли какой-либо поддерживаемый способ инициировать реальную перекомпоновку макета, не нарушая встроенные жесты сжатия, или мне следует отказаться от этой идеи, поскольку она по своей сути противоречит требованиям доступности?
/>
Мне нужно, чтобы [b]собственный жест масштабирования[/b] в мобильных браузерах вел себя как настоящее масштабирование браузера: когда пользователь сводит пальцы, медиа-запросы должны пересчитываться, а макет должен перекомпоновываться. В то же время горизонтальная прокрутка должна оставаться отключенной (чтобы ширина области просмотра оставалась фиксированной). Проблема, с которой я столкнулся: [list] [*]В мобильных браузерах масштабирование рассматривается как [b]лупа[/b]. Макет остается фиксированным; медиа-запросы не срабатывают.
[*]Прослушивание VisualViewport.resize и ручное масштабирование элементов делает их больше, но по-прежнему вызывает горизонтальную прокрутку.
[*]Я могу обойти это, установив html {position: fix; , перехват событий указателя, установка переменных CSS и принудительное перекомпонование. Однако я смогу заставить его работать, только если отключу вертикальную прокрутку ([code]overflow: hidden). В тот момент, когда я разрешаю вертикальную прокрутку, возвращается исходное поведение.
[*]Чтобы сохранить настраиваемый масштаб, мне приходится блокировать сенсорное действие [/code] на корневом элементе, что по сути отключает встроенное сжатие. Это похоже на нарушение специальных возможностей (WCAG 1.4.4). Итак, вопрос в следующем: [b]Имеет ли смысл выпускать такое пользовательское масштабирование, если основная цель – сохранить доступность страницы?[/b] Существует ли какой-либо поддерживаемый способ инициировать реальную перекомпоновку макета, не нарушая встроенные жесты сжатия, или мне следует отказаться от этой идеи, поскольку она по своей сути противоречит требованиям доступности? /> [/list]
Мобильная версия