Масштабирование страницы в браузерах
Вопрос состоит в следующем: возможно ли изменить рамер div'a или изменить картинку при изменении пользователем масштаба страницы.
Нужно, потому как при масштабе страницы в 200% картинки соответственно расплываются и хотелось бы заменить её на картинку соответствующего раздела. |
поснимай показания размеров с рисунков, и с тела документа(видимой области)
и поэксперементируй в разных браузерах, какие велечины, и как именно будут менятся http://javascript.ru/blog/Andrej-Par...enta-elementov |
gizmomy,
А Вы уверены, что хотите этого? Вдруг, у пользователя слабоватое зрение, и он специально захотел рассмотреть картинку поближе, увеличив масштаб браузера? |
Gvozd,
А яваскрипт не улавливает моменты, когда пользователь меняет масштаб страницы… subzey, ну так я и хочу пользователю показать эту же картинку, но в большем размере. |
Ну, на самом деле, есть способ узнать масштаб, но он грязный и требует четырех reflow, что не есть труъ.
function getScale(){
var ct = document.createElement("div"); // создаем див
ct.style.position = "fixed"; // задаем отображение от вьюпорта
ct.style.margin = "0px"; // на всякий случай
ct.style.width = "100%"; // ширина дива — ширина вьюпорта
var sb = document.documentElement.style.overflow; // сохраняем старое значение overflow
document.body.appendChild(ct); // вставляем в документ
document.documentElement.style.overflow = "hidden"; // это значение действует на самом деле не на <html>, а на ICB, равный по ширине вьюпорту
var zoomRatio = window.innerWidth / ct.clientWidth; // делим ширину окна на ширину вьюпорта
document.documentElement.style.overflow = sb; // возвращаем стиль на место
document.body.removeChild(ct); // удаляем див
return zoomRatio;
}
alert("Масштаб:" + Math.round(getScale() * 100) + "%");
Проверял только на Опере 10.50, но, возможно, с минимальным изменением, будет работать и в других браузерах. Про viewport, initial containing block («ICB») и прочее можно почитать тут. И, последнее, прошу, не используйте это знание во зло — иногда пользователю самому виднее, как использовать фичи его браузера. |
subzey,
Спасибо. В Хроме и Мозилле масштаб определяет. В ИЕ7 — NaN. Однако, если увеличивать масштаб страницы, то скрипт все равно выдает 100%, даже если страницу перегрузить в увеличенном масштабе. Короче простого способа видимо нет, а городить огород действительно не нужно. Еще раз спасибо. |
Скажыте неуду в скриптах.... как сделать маштабирования екрана 800*600 для всех екранов.....
Если напишете мне скрипт буду кланятса долго.... Пробывал - не выйшло. |
Цитата:
http://ru.wiktionary.org/wiki/%D0%BF...%D1%82%D 1%8C http://dal.sci-lib.com/word033542.html |
Как же меня бесят неграмотные люди, которые одно слово от другого оличить не могут.
Эта фраза звучит как "Я с утра ехал кашу" вместо "Я с утра ел кашу"... Запомните, слова пробОвал и пробЫвал означают совершенно разные действия! |
Цитата:
лучше чем випендрюватися, ты помог бы со скриптами ... :help: |
У меня нет желания помогать людям, которые не могут пару предложений написать по-русски.
|
ZoNT,
этот сайт, кстати, доступен также по адресу http://javascript.com.ua/. Вы и у украинцев будете русский язык спрашивать? :) |
Цитата:
И да, сравнивать украинский язык с безграмотностью как-то неправильно. |
Kolyaj,
я и не сравниваю. Просто если для русского русский язык является родным, то для украинца или беларуса — совсем необязательно. Стóит ли так придираться? Или каждому, кто не уверен в знаниях русского, добавлять в начале поста «WARNING! This text may contain errors!», дабы не быть обплеванным местными граммар-наци? |
Ну по крайней мере, если человек скажет, что русский язык для него не родной, отношение будет более спокойное. Имеются в виду все-таки русские "грамотеи".
http://ilyabirman.ru/meanwhile/2009/01/30/1 Цитата:
|
с помощью jQuery:
$(window).resize(function(){
//здесь обработчик
})
|
Попробуем найти решение
Метод jQuery, видимо, побочно отлавливает это событие из-за изменений размеров окна (описание ниже по тексту) в браузерах Google Chrome и Opera (в Mozilla, например, это не работает), и, кстати, это никак не помогает отследить уже установленные параметры зума браузера.
Тем не менее, мне показалось, что это возможно в последних версиях таких популярных браузеров как: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:17.0) Gecko/20100101 Firefox/17.0 Opera/9.80 (X11; Linux i686) Presto/2.12.388 Version/12.12 Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.97 Safari/537.11 (работу под IE9+ равно как и вообще в ОС MS Windows и Apple MacOS не проверял еще). На чистоту метода не претендую, опишу только своё видение решения. Итак, на сегодняшний день я заметил два способа изменения масштаба отображаемой страницы в браузерах: 1) Google Chrome и Opera - движёк браузера фиктивно изменяет размеры окна, но оставляет прежними его внешние размеры, соответственно, узнать об этом мы можем сравнив два парных свойства объекта window: innerWidth/innerHeight и outerWidth/outerHeight; 2) Mozilla - движёк браузера фиктивно изменяет размер окна браузера, и пропорционально изменяет размер экрана пользователя, соответственно, узнать об этом мы можем сравнив два парных свойства объекта window: innerWidth/innerHeight и screen.width/height. (Это совсем просто заметить на странице http://internet.yandex.ru судя по данным которой IE8 ведет себя так же, как Mozilla.) Экспериментируем, например, так: var wIn = window.innerWidth, hIn = window.innerHeight, wOut = window.outerWidth, hOut = window.outerHeight, wScr = window.screen.width, hScr = window.screen.height; var wB = document.body.offsetWidth; var output = "inner: " + wIn + " - " + hIn + "\n" + "outer: " + wOut + " - " + hOut + "\n" + "screen: " + wScr + " - " + hScr + "\n\n" + "body: " + wB + "\n\n" + "соотношения сторон:" + "\n" + "in - " + (wIn/hIn) + "\n" + "out - " + (wOut/hOut) + "\n" + "scr - " + (wScr/hScr) ; alert ( output ); Только пока не смог придумать (или понять), как же тогда узнать реальное разрешение экрана у пользователя для браузеров, которые его якобы изменяют в угоду своей функциональности? |
Цитата:
|
Тема раскрыта.
Тема не раскрыта и требует своего логического завершения!
Поэтому добавлю еще два момента: 1) Чтобы не дублировать просто дам ссылку на развёрнутое изучение данного вопроса на стэке: ссылка Из которого следует, что мы не сможем узнать текущее значение масштаба для старых версий браузеров, но можем это сделать во всех современных, впрочем в некоторых пока только через определённые хаки. 2) Метод jQuery, конечно же, работает в Mozilla, так как использует стандартные события, но имеет свои особенности, например, у меня в проекте на mousewheel было назначено своё действие масштабирования (но без нажатия на ctrl), в связи с чем принятое по умолчанию в браузере действие ctrl+mousewheel у меня попросту не срабатывало, а выполнялось только то действие, которое я назначил (при нажатии ctrl+"+/-" конечно же всё отлавливалось). |
Цитата:
зажатие контрола нужно было ещё проверять и счастье было бы не нужно "раскрывать тему" -лучше займитесь изучением основ и "раскрывать тему" не понадобиться... |
Для маштабирования страницы сайта под ширину экрана использую HTMLScale http://www.cms-sd.ru/stati/javascript_i_jquery/htmlscale_mashtabirovanie_stranici_pod_shirinu_ekr ana
|
Не знаешь падежов, не говори глупостёв
А не надо оно тебе, работать не будет, если туго с грамматикой
|
| Часовой пояс GMT +3, время: 15:39. |