Как узнать zoom браузера

07/08/2010, автор admin, категории Web-разработка

Конечно не часто заказчики смотрят на то как выглядит сайт при различных уровнях зума браузера, а мне довелось повстречать таких. И что же вы думаете? Конечно же между некоторыми картинками возникает небольшой зазор в 1px, но это еще пол беды jquery да и вообще javascript почему то неккоректно определяет размеры блоков и двигающиеся слайды уезжают слишком далеко при прокрутке. Конечно зная какой zoom имеет тот или иной браузер opera, firefox, safari или какой либо другой эту проблему можно решить.
Все бы было хорошо если бы существовала единная функция для всех браузеров, что нибудь универсальное типа getZoom или getScale, но к сожалению такого еще не придумали. Решенить этот вопрос все таки удалось, хотя мы потратили не мало времени. Напишем несколько функций на js которые и будут определять уровень зума. По onload запомниаются первоначальные параметры браузера, которые мы будем считать 100% уровнем зума, при изменении масштаба уровень зума вычисляется заново исходя из предыдущих параметров<body onload="getValues()"  onresize="getScale()"> Вот сам скрипт и описание работы var sw = screen.width;
var sh = screen.height;
var iw = window.innerWidth;
var ih = window.innerHeight;
function getValues(){
  sw = screen.width;
  sh = screen.height;
  iw = window.innerWidth;
  ih = window.innerHeight;
}
function getScale() {
  if (Math.round(window.innerWidth*100/iw) !=     Math.round(window.innerHeight*100/ih)){
    //зум не изменился, поменялись размеры окна
    getValues(); //обновим значения ширины и высоты
  }
  else {
    //изменился уровень зума
    scale = Math.round(iw/window.innerWidth * 10);
    alert(scale);
  }
}
Первоначальные значения параметров лучше записать в куки, и если происходит изменение размеров окна (не изменяется масштаб), значения занесенные в cookie перезаписывать на новые. В последующем узнавать масштаб исходя из этих значений.

Можно прочесть также:

Комментарии закрыты.