Предоставляет ли iOS / mobile Safari событие javascript или медиа-запрос для управления размером шрифта? - PullRequest
Новая
       9

Предоставляет ли iOS / mobile Safari событие javascript или медиа-запрос для управления размером шрифта?

0 голосов
/ 10 октября 2019

Адаптивный веб-сайт, стиль которого я использую, использует js для определения размеров шрифта, а затем применяет классы, которые используются css для различных настроек макета. В двух словах, мой js обнаруживает изменение размера диапазона, заключенного в текстовый символ. В новейшей версии мобильного Safari предусмотрена возможность изменения размера шрифта, а механизм масштабирования не вызывает моего обнаружения js. Какие-либо идеи о событиях или других изменениях, которые я могу использовать для определения изменения размера шрифта мобильного Safari? Может быть, css медиа запрос? Я попробовал решение, основанное на js intersectionobserver: работал на настольном компьютере, но не на мобильном: - (

Ответы [ 2 ]

0 голосов
/ 10 октября 2019

Итак, что делает мобильное сафари: при увеличении шрифта область просмотра становится уже. Существует широко поддерживаемый метод window.matchMedia ( здесь медиа-запрос ), который возвращает «объект медиа-запроса», к которому может быть добавлен слушатель. В моем случае я хочу знать, когда область просмотра уже, чем apx. 320px ... в этом случае я буду применять мои классы стайлинга.

0 голосов
/ 10 октября 2019

Согласно MDN

Свойство CSS для настройки размера текста управляет алгоритмом накачивания текста, используемым на некоторых смартфонах и планшетах. Другие браузеры будут игнорировать это свойство.

Обязательно укажите свойства CSS, такие как 

/* Keyword values */
text-size-adjust: none;
text-size-adjust: auto;

/* <percentage> value */
text-size-adjust: 80%;

/* Global values */
text-size-adjust: inherit;
text-size-adjust: initial;
text-size-adjust: unset;

Однако в Safari для iOS поддерживаются только непроцентные значения.

Также рассмотрите документацию Apple . , в которой объясняется, как можно использовать проценты для коэффициента изменения размера текста. 

html {-webkit-text-size-adjust:200%}

Я не уверен, какой изэто правильно, так как они противоречат друг другу. Вы должны убедиться в этом сами и посмотреть, что работает лучше для вас.

PS: Обязательно включите префикс -webkit- для указанных свойств, чтобы убедиться, что он работает для Safari и других браузеров WebKit.

...