Определить масштабирование страницы

Question

Я пишу веб-страницу с Javascript. Мне нужно как-то работать со своими свойствами слоя DIV, относящимися к масштабированию страницы.

Как я могу это сделать? Вы можете найти пример на странице apple . Попробуйте масштабировать его и посмотреть на верхнее меню.

Answer 1

РЕДАКТИРОВАТЬ: Я думал, масштабирование означает изменение размера окна. Вы имели в виду увеличение и уменьшение масштаба, мой плохой.

---

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

div {
    width: %; //percentage value you want
    min-width: px; //the minimum pixel value you want
}

Таким образом, он расширяется и уменьшается с шириной страницы, но сохраняет минимальную ширину для удобства чтения

Кроме того, использование em в качестве font-size также поможет сохранить динамический размер текста.

Answer 2

Такое (или подобное) поведение вы встретите практически на любом сайте.Не тестировал его в других браузерах, но здесь - мой ответ на тот же вопрос, касающийся firefox.

Answer 3

Вы должны использовать EM для всех ваших измерений, поэтому все ваши элементы будут масштабироваться (когда включено масштабирование только по размеру шрифта). Таким образом, вы можете измерить размер шрифта для элементов, чтобы узнать, был ли изменен масштаб текста.

Нет способа узнать, была ли страница увеличена браузером или нет (как я писал, только если используется масштабирование текста)

вот обходной путь: он будет работать только при увеличении размера шрифта http://jsfiddle.net/gGdAq/4/

В основном, если ширина в пикселях интересующего вас элемента не является базовым размером шрифта * ширина в странице была увеличена.

Может быть, этот вопрос поможет: Поймать событие браузера "zoom" в JavaScript