С Новым годом! Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.64/75: Рейтинг темы: голосов - 75, средняя оценка - 4.64
0 / 0 / 0
Регистрация: 01.01.2013
Сообщений: 38

Как узнать текущее масштабирование страницы?

20.11.2015, 09:02. Показов 16112. Ответов 15

Студворк — интернет-сервис помощи студентам
День добрый, с синтаксисом js слабо знаком, потому прошу помочь.
Когда пользователь заходит на сайт/обновляет его мне нужно узнать, масштабирован ли у него в браузере мой сайт или нет.
Нужно это для моей системы автоподгонки резиновой вёрстки под размер окна юзера, когда он заходит на сайт. Система эта сделана, да вот если пользователь масштабирует страницу и после этого перезаходит на/обновляет страницу, то размер сайта подгоняется, а окаянный шрифт остаётся слишком большим или маленьким, портя всё.
Потому я хочу сделать так, чтобы сайт подгонялся только при 100% масштабе ну или чтобы шрифт изменялся пропорционально масштабу.
В интернетах наткнулся на вроде бы нужный мне код:
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
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) + "%");
Может этот код когда-то и где-то работал, но сейчас он мне на выходе выдаёт NaN.

Ещё как вариант чтобы масштаб в самом браузере при .ready менялся на 100%, но это, наверное, совсем из ряда фантастики.
0
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
20.11.2015, 09:02
Ответы с готовыми решениями:

Создайте командный файл, который спрашивает: «Вы хотите узнать текущее время или текущую дату?» – и в зависимости от ответа выдает на экран текущее вр
Здраствуйте очень сильно нужна помощь в написании батников кто может помогите пожалуйста!!! 1 Создайте командный файл, который...

как узнать текущее время
Помогите пожалуйста как узнать текущее время dateTimePicker1.валуе показывает нормально но только показывает время создания ...

Как узнать текущее положение в файле?
Как узнать текущее положение в файле? Я вызываю функцию и передаю ей смешение, она должна вызвать SetFilePointerEx(File, CompositOffset,...

15
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
20.11.2015, 12:20
Diskyp,
Попробуй такой вариант. В Хроме работает, в остальных не смотрел.
JavaScript
1
2
3
4
window.defaultWidth = window.innerWidth;
window.onresize = function () {
    console.log((window.defaultWidth / window.innerWidth).toFixed(2) * 100);
};
0
0 / 0 / 0
Регистрация: 01.01.2013
Сообщений: 38
20.11.2015, 16:58  [ТС]
Цитата Сообщение от Padimanskas Посмотреть сообщение
Diskyp,
Попробуй такой вариант. В Хроме работает, в остальных не смотрел.
Проблема в том, что изначально пользователь может обновить страницу с каким угодно масштабом и в этом коде он будет считаться за 100%, хотя это не так. Потому при попадании юзера на страницу мне нужно как-то определить с каким масштабом в браузере он зашёл, дальнейшее слежение за его изменением мне не нужно.
0
В поисках себя
 Аватар для Glart
115 / 89 / 34
Регистрация: 12.11.2015
Сообщений: 529
20.11.2015, 17:02
Не уверен, но может поможет em:

CSS
1
font-size:1.1em;
0
0 / 0 / 0
Регистрация: 01.01.2013
Сообщений: 38
20.11.2015, 18:31  [ТС]
Цитата Сообщение от Glart Посмотреть сообщение
Не уверен, но может поможет em:
Каким образом он поможет? Вы, наверное, не поняли сути вопроса.
0
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
20.11.2015, 19:55
Цитата Сообщение от Diskyp Посмотреть сообщение
с каким масштабом в браузере он зашёл, дальнейшее слежение за его изменением мне не нужно.
JavaScript
1
2
3
4
window.onload = function(){
    alert(window.screen.availWidth- (window.screen.availWidth - window.innerWidth));
    alert(window.screen.availHeight - (window.screen.availHeight - window.innerHeight));
};
0
В поисках себя
 Аватар для Glart
115 / 89 / 34
Регистрация: 12.11.2015
Сообщений: 529
20.11.2015, 19:57
Цитата Сообщение от Diskyp Посмотреть сообщение
а окаянный шрифт остаётся слишком большим или маленьким
Цитата Сообщение от Diskyp Посмотреть сообщение
Каким образом он поможет?
Ну как бы вот.
0
0 / 0 / 0
Регистрация: 01.01.2013
Сообщений: 38
20.11.2015, 20:17  [ТС]
Цитата Сообщение от Padimanskas Посмотреть сообщение
JavaScript
1
2
3
4
window.onload = function(){
 alert(window.screen.availWidth- (window.screen.availWidth - window.innerWidth));
 alert(window.screen.availHeight - (window.screen.availHeight - window.innerHeight));
};
Этот код просто определил размеры вьюпорта, но это мне не поможет, т.к. юзер, к примеру, может иметь окно браузера 800х600, а может уменьшить масштаб в браузере с окна в 1920х1680 до 800х600 и во втором случае сайт подстроится под новое разрешение (уменьшится основной контейнер и шрифт), но при этом шрифт уменьшит ещё в довесок и сам браузер и он станет крошечным, а мне надо, чтобы в обеих случаях сайт смотрелся одинаково.

Добавлено через 7 минут
Цитата Сообщение от Glart Посмотреть сообщение
Ну как бы вот.
Изменение шрифта в процентах происходит от значения его родителя или по дефолту 16px и, насколько я знаю,невозможно сделать чтобы шрифт корректировался относительно размера блочного элемента-родителя. И темболее этого не умеют делать величины измерения кроме vh и vw, но они статичны и работают относительно размера вьюпорта, что портит весь мой замысел.
0
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
20.11.2015, 22:52
Цитата Сообщение от Diskyp Посмотреть сообщение
Этот код просто определил размеры вьюпорта, но это мне не поможет, т.к. юзер, к примеру, может иметь окно браузера 800х600, а может уменьшить масштаб в браузере с окна в 1920х1680 до 800х600 и во втором случае сайт подстроится под новое разрешение (уменьшится основной контейнер и шрифт), но при этом шрифт уменьшит ещё в довесок и сам браузер и он станет крошечным, а мне надо, чтобы в обеих случаях сайт смотрелся одинаково.
У тебя уже есть набор событий onresize, onload, а так же свойства хранящие внутренние, относительные, общие и реальные размеры. Этими данными можно измерить все вдоль и поперек и в любое время работы браузера. Ну а если ты тупо верстальщик и слегка не знаешь как делается адаптивный шаблон, то время идти в раздел "верстальщик" и не впаривать тут никому свои дилетантские выводы. Надеюсь доходчиво
0
0 / 0 / 0
Регистрация: 01.01.2013
Сообщений: 38
21.11.2015, 06:15  [ТС]
Цитата Сообщение от Padimanskas Посмотреть сообщение
У тебя уже есть набор событий onresize, onload, а так же свойства хранящие внутренние, относительные, общие и реальные размеры. Этими данными можно измерить все вдоль и поперек и в любое время работы браузера. Ну а если ты тупо верстальщик и слегка не знаешь как делается адаптивный шаблон, то время идти в раздел "верстальщик" и не впаривать тут никому свои дилетантские выводы. Надеюсь доходчиво
Ты понимаешь, что при масштабировании изменяется размер окна браузера? Вот у меня при 100% масштаба окно 800х600, а при 150% 1200х900 И ПРИ ЛЮБЫХ ТВОИХ ИЗМЕРЕНИЯХ мне выдаётся ТЕКУЩИЙ РАЗМЕР окна браузера с учётом масштаба.
Мне нужно узнать размер окна браузера с событием .ready (при загрузке страницы), каким бы он был при 100% масштаба, независимо от того, как юзер замасштабировал сайт ранее или же узнать текущее значение масштабирования страницы.
Я просто не знаю синтаксиса js и думал мне подскажут нужную функцию типа .getScale() или что-то подобное, что определяет значение масштаба в браузере.
И я тебе совершенно осознанно говорю, что ты говоришь мне совсем не то, что нужно. Либо пытайся лучше вникнуть в мой вопрос, либо иди лесом и не впаривай тут мне свои дилетантские выводы.
Надеюсь доходчиво.
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
21.11.2015, 11:14
Цитата Сообщение от Diskyp Посмотреть сообщение
Либо пытайся лучше вникнуть в мой вопрос, либо иди лесом и не впаривай тут мне свои дилетантские выводы.
а вы, в свою очередь, попытайтесь представить себя диктором центрального телевидения, который в программе "Время" озвучивает для населения очередной официальный бред нашего правительства типа "какой молодец наш нацик-лидер Путин, и какие ужасные чмошники все эти Обамы и прочие гейропейцы".
вы очень умело и профессионально модулируете своими голосом и интонацией, в нужные моменты повышаете громкость произносимых вами фраз почти до крика, а в других случаях понижаете голос почти до шёпота.
по окончании вашей речи все присутствующие в телестудии ваши коллеги аж "заходятся" в рукоплесканиях и криках "браво" в ваш адрес.

а через полчаса после окончания программы "Время" в телестудию поступает результат телефонного блиц-опроса телезрителей, из которого выясняется, что из 100 случайно опрошенных телезрителей, смотревших в этот вечер телевизор, целых 60 человек не слышали ни единого вашего слова и не запомнили ни единой фразы из всех вами произнесённых.
вы негодуете - как же так?? вы же так старались?!
вы не верите этим результатам и требуете разъяснений от "службы опросов" Останкино
и таковые разъяснения получаете:
во-первых, 40 опрошенных в этот вечер смотрели не Первый телеканал, а какой-то другой
во-вторых, у 15-ти человек громкость телевизоров была уменьшена до минимума, потому что "программа выходит поздно и дети уже спят" и потому они ничего не расслышали
в третьих, 5 человек из опрошенных случайно оказались вашими соседями по подъезду, которые лично вас ненавидят за ваше высокомерие, за то, что вы не здороваетесь с ними, когда встречаетесь на лестничной площадке, в лифте или у подъезда, и потому они всякий раз вообще отключают звук своих телевизоров, когда слышат ваш голос.
вот так вот -- при всём вашем ораторском искусстве вы никак не можете контролировать внешнее (по отношению к телевизору) поведение телезрителей.

изменение масштаба выбором соответствующих пунктов меню браузера или нажатием кнопок Ctrl + + (или Ctrl + -) на клавиатуре -- это такое же внешнее поведение браузеро-пользователей (по отношению к браузеру) и авторы интернет-страниц также никак не могут его контролировать

такие дела
постарайтесь более не разбрасываться своими глупыми упрёками в дилетантизме в адрес моих уважаемых коллег
1
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
21.11.2015, 13:36
kalabuni,
0
супермизантроп
Эксперт JS
3941 / 2979 / 692
Регистрация: 18.04.2012
Сообщений: 8,629
21.11.2015, 13:36
Padimanskas, насчёт "уважаемого" я, походу, погорячился
мне надо было использовать другое прилагательное
0
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
21.11.2015, 13:44
Короче, все работает и Ctrl + + (или Ctrl + -) в т.ч. смотрим, пробуем в консоли
сперва сохраняем window.innerWidth
JavaScript
1
2
3
4
window.onclick=function(){
    alert(window.screen.availWidth- (window.screen.availWidth - window.innerWidth));
    alert(window.screen.availHeight - (window.screen.availHeight - window.innerHeight));
};
или/и
JavaScript
1
window.onresize=function(){...};
Добавлено через 1 минуту
Цитата Сообщение от kalabuni Посмотреть сообщение
насчёт "уважаемого" я, походу, погорячился
мне надо было использовать другое прилагательное
я слегка перепутал, сорри мен ^-^
0
0 / 0 / 0
Регистрация: 01.01.2013
Сообщений: 38
21.11.2015, 19:25  [ТС]
Цитата Сообщение от kalabuni Посмотреть сообщение
постарайтесь более не разбрасываться своими глупыми упрёками в дилетантизме в адрес моих уважаемых коллег
А то, что точно такой же упрёк выдвинули в мой адрес постом выше, а я просто спарировал естественно неважно, ведь кому есть дело до очередного Васи Пупкина из интернетов с нулевым рейтингом.
Цитата Сообщение от Padimanskas Посмотреть сообщение
Короче, все работает и Ctrl + + (или Ctrl + -) в т.ч. смотрим, пробуем в консоли
сперва сохраняем window.innerWidth
Я ещё раз говорю, это совершенно не то, что нужно. При масштабе в 100% мне выдаст 800х600, при масштабе 150% мне выдаст 1200х900. Мне же нужно, чтобы при любом масштабе выдавало 800х600, тоесть "истинное" значение окна браузера, без его модификации масштабом.
Перестань настаивать на своей глупости и
Цитата Сообщение от Diskyp Посмотреть сообщение
Либо пытайся лучше вникнуть в мой вопрос, либо иди лесом и не впаривай тут мне свои дилетантские выводы.
Проблема всё ещё в силе, ищу варианты её решения.

Добавлено через 15 минут
Кстати заметил одну интересную вещь, что при "исследовании элемента" в браузере у элементов, имеющих 100% ширину и высоту, пиксельные размеры при масштабировании не изменяются, тоесть в этом самом инспекторе всегда показывается первоначальный размер у таких элементов, в частности у html. При этом если замерить размер окна браузера с помощью js, то мне выдаст модифицированный масштабом размер. Долго и упорно пытался эти цифры как-то вытащить с помощью js, но всё не получалось, можно ли как-то узнать размер html?
0
Superposition
 Аватар для Padimanskas
950 / 615 / 256
Регистрация: 27.10.2013
Сообщений: 2,083
23.11.2015, 10:08
Diskyp,

Не по теме:

Лопату тебе в руки и на завод D

0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
23.11.2015, 10:08
Помогаю со студенческими работами здесь

Как узнать текущее московское время?
Как узнать текущее московское время?

Как узнать текущее разрешение экрана?
а? :)

Как узнать текущее состояние процесса
Здравствуйте уважаемые эксперты. Собственно вопрос стоит в названии темы, как можно узнать текущее состояние процесса, т.е. находится он в...

Как узнать текущее разрешение экрана?
Пишу программу в Windows Forms на С++. Для корректного рисования компонентов форм на разных компьютерах нужно знать текущее разрешение...

Как узнать текущее положение курсора ?
Добрый день ! Подскажите пожалуйста как узнать текущее положение курсора ? как я понял должна быть какая-то функция которая...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
16
Ответ Создать тему
Новые блоги и статьи
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост.
Programma_Boinc 28.12.2025
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / **********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / **********/ gallery/ bKBkQFf Пост отсюда. . .
Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США.
Programma_Boinc 26.12.2025
Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка.
Programma_Boinc 23.12.2025
Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Как объединить две одинаковые БД Access с разными данными
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru