узнать ширину рабочей области браузера до загрузки body

@Swarex · Регистрация: 12.12.2012

Студворк — интернет-сервис помощи студентам

как узнать ширину рабочей области браузера(не экрана/окна),причём до загрузки <body>?

@kalabuni · 27.04.2013, 18:13

странно... по содержанию вопроса вы вроде всё понимаете
а вот по сути...

по сути ваш вопрос из серии "а фильм про сына Штирлица хороший или плохой?"
вам отвечают - "да не снимали ещё такого фильма!"
вы в ответ - "да я знаю, что не снимали, но мне всё-равно узнать хочется - он хороший или плохой..."

ширина рабочей области объекта - это свойство clientWidth существующего объекта
нельзя узнать значение свойства ещё НЕсуществующего объекта, как и нельзя узнать - хорошим или плохим будет ещё не снятый фильм

@Swarex · 27.04.2013, 19:53 **[ТС]**

м.б.
но браузер же ещё до загрузки body знает,какая ширина выделена под документ.или нет?
рабочая область и body - не совсем одно и то же.
ну а если так всё-таки нельзя - как можно сделать ширину двух колонок относительно резиновой(допустим три конкретных значения:100,150,200, в зависимости собственно от ширины документа?(опять таки до загрузки, что бы пользователь не имел счастья видеть сначала колонки одного размера,а потом другого)?

Dmitry · 27.04.2013, 19:56

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type="text/javascript">
 if (self.screen)
    {
    width = screen.width
    height = screen.height
    }
 else if (self.java)
    {
    var jkit = java.awt.Toolkit.getDefaultToolkit();
    var scrsize = jkit.getScreenSize();
    width = scrsize.width;
    height = scrsize.height;
    }
 </script>

@Swarex · 27.04.2013, 20:46 **[ТС]**

можно подробнее:
что такое self?
либо я не понял,либо енто вернёт ширину экрана,а не сабжа

Dmitry · 27.04.2013, 20:53

Сообщение от Swarex

енто вернёт ширину экрана

да, ширину экрана

@Swarex · 27.04.2013, 21:49 **[ТС]**

Сообщение от Dmitry

да, ширину экрана

гхм,на всякий случай скопирую сюда вопрос:

Сообщение от Swarex

как узнать ширину рабочей области браузера(не экрана/окна),причём до загрузки <body>?

@kalabuni · 28.04.2013, 15:24

способов много
например, можно сделать тело документа невидимым body {visibility: hidden}
по окончании загрузки определить значение document.body.clientWidth
и сделать соответствующие изменения геометрии
и потом только "показать" пользователю результат
document.body.style.visibility = 'visible';

а можно и вовсе грузить "пустое" тело документа и потом, после определения document.body.clientWidth, вообще всё содержимое формировать исключительно скриптом...

только один вопрос остаётся - а что вы будете делать, если клиент, загрузив страницу и насладившись её безупречным внешним видом, вдруг захочет изменить размеры окна браузера?
ведь все ваши "ужимки" и "прыжки" в итоге тогда окажутся напрасной тратой времени, нет?

@Galphimbl · 29.04.2013, 16:35

если вы устанавливаете ширину/высоту в зависимости от окна браузера, почему бы вам просто не поставить ее в процентном соотношении?

@Swarex · 05.05.2013, 15:16 **[ТС]**

Сообщение от kalabuni

способов много
например, можно сделать тело документа невидимым body {visibility: hidden}
по окончании загрузки определить значение document.body.clientWidth
и сделать соответствующие изменения геометрии
и потом только "показать" пользователю результат
document.body.style.visibility = 'visible';

а можно и вовсе грузить "пустое" тело документа и потом, после определения document.body.clientWidth, вообще всё содержимое формировать исключительно скриптом...

только один вопрос остаётся - а что вы будете делать, если клиент, загрузив страницу и насладившись её безупречным внешним видом, вдруг захочет изменить размеры окна браузера?
ведь все ваши "ужимки" и "прыжки" в итоге тогда окажутся напрасной тратой времени, нет?

первый способ некрасивый,т.к. долго смотреть на пустую страницу тоже никому не хочется,а второй способ конечно рабочий, но не совсем по вопросу)
на случай изменения окна есть window.onresize)))

в процентах указывать не хочу,т.к. колонки должны изменяться в определённых границах.

KOPOJI · 05.05.2013, 16:20

Сообщение от Swarex

т.к. колонки должны изменяться в определённых границах.

min-width/min-height + max-width/max-height ?

Добавлено через 2 минуты
если уж на то дело пошло, есть css3 media queries пример, подробно

@Swarex · 06.05.2013, 12:01 **[ТС]**

Сообщение от KOPOJI

min-width/min-height + max-width/max-height ?

Добавлено через 2 минуты
если уж на то дело пошло, есть css3 media queries пример, подробно

идея в реализации именно этого варианта,а не альтернативных))но если я правильно понял - решения в таком виде действительно нет

css3 много где не поддерживается

@MVS76 · 06.05.2013, 15:03

Если я правильно понял, нужно что-то вот так:

CSS
1
2
3
4
5
.column_left {
width:20%;
max-width:270px;
min-width:190px
}

Работает вроде везде, в ИЕ 5/6 не проверял

@kalabuni · 06.05.2013, 16:45

доступ к объекту document.body появляется сразу после открывающего тега <body>
так что как вариант - сразу после открытия <body> вставляете скриптовой блок, где определяете ширину экрана,
заносите это значение в глобальную переменную, ну а далее по коду везде, где у вас имеется зависимость от ширины экрана, тупо прописываете эту зависимость через document.write
приблизительно так:

HTML5
1
2
3
4
5
6
7
8
9
<body>
<script>var startWidth = document.body.clientWidth;</script>
<!-- содержимое -->
<script>
document.write ('<div id="myDV1" style="width: ' + startWidth * .55 / Math.PI + Math.sin (2) + 'px;">');
</script>
бла-бла-бла...внутри дива
</div>
<!-- продолжение контента -->

Новые блоги и статьи Все статьи Все блоги /
http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .	Расчёт переходных процессов в цепи постоянного тока igorrr37 16.01.2026 / * Дана цепь постоянного тока с R, L, C, k(ключ), U, E, J. Программа составляет систему уравнений по 1 и 2 законам Кирхгофа, решает её и находит переходные токи и напряжения на элементах схемы. . . .	Восстановить юзерскрипты Greasemonkey из бэкапа браузера damix 15.01.2026 Если восстановить из бэкапа профиль Firefox после переустановки винды, то список юзерскриптов в Greasemonkey будет пустым. Но восстановить их можно так. Для этого понадобится консольная утилита. . .
Сукцессия микоризы: основная теория в виде двух уравнений. anaschu 11.01.2026 https:/ / rutube. ru/ video/ 7a537f578d808e67a3c6fd818a44a5c4/	WordPad для Windows 11 Jel 10.01.2026 WordPad для Windows 11 — это приложение, которое восстанавливает классический текстовый редактор WordPad в операционной системе Windows 11. После того как Microsoft исключила WordPad из. . .	Classic Notepad for Windows 11 Jel 10.01.2026 Old Classic Notepad for Windows 11 Приложение для Windows 11, позволяющее пользователям вернуть классическую версию текстового редактора «Блокнот» из Windows 10. Программа предоставляет более. . .	Почему дизайн решает? Neotwalker 09.01.2026 В современном мире, где конкуренция за внимание потребителя достигла пика, дизайн становится мощным инструментом для успеха бренда. Это не просто красивый внешний вид продукта или сайта — это. . .

@Swarex 5 / 5 / 0 Регистрация: 12.12.2012 Сообщений: 183

	узнать ширину рабочей области браузера до загрузки body 27.04.2013, 17:46. Показов 5045. Ответов 13 Метки нет (Все метки) как узнать ширину рабочей области браузера(не экрана/окна),причём до загрузки <body>? 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	27.04.2013, 18:13
	странно... по содержанию вопроса вы вроде всё понимаете а вот по сути... по сути ваш вопрос из серии "а фильм про сына Штирлица хороший или плохой?" вам отвечают - "да не снимали ещё такого фильма!" вы в ответ - "да я знаю, что не снимали, но мне всё-равно узнать хочется - он хороший или плохой..." ширина рабочей области объекта - это свойство clientWidth существующего объекта нельзя узнать значение свойства ещё НЕсуществующего объекта, как и нельзя узнать - хорошим или плохим будет ещё не снятый фильм 0

@Swarex 5 / 5 / 0 Регистрация: 12.12.2012 Сообщений: 183
	27.04.2013, 19:53 [ТС]
	м.б. но браузер же ещё до загрузки body знает,какая ширина выделена под документ.или нет? рабочая область и body - не совсем одно и то же. ну а если так всё-таки нельзя - как можно сделать ширину двух колонок относительно резиновой(допустим три конкретных значения:100,150,200, в зависимости собственно от ширины документа?(опять таки до загрузки, что бы пользователь не имел счастья видеть сначала колонки одного размера,а потом другого)? 0

@Swarex 5 / 5 / 0 Регистрация: 12.12.2012 Сообщений: 183
	27.04.2013, 20:46 [ТС]
	можно подробнее: что такое self? либо я не понял,либо енто вернёт ширину экрана,а не сабжа 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,629
	28.04.2013, 15:24
	способов много например, можно сделать тело документа невидимым body {visibility: hidden} по окончании загрузки определить значение document.body.clientWidth и сделать соответствующие изменения геометрии и потом только "показать" пользователю результат document.body.style.visibility = 'visible'; а можно и вовсе грузить "пустое" тело документа и потом, после определения document.body.clientWidth, вообще всё содержимое формировать исключительно скриптом... только один вопрос остаётся - а что вы будете делать, если клиент, загрузив страницу и насладившись её безупречным внешним видом, вдруг захочет изменить размеры окна браузера? ведь все ваши "ужимки" и "прыжки" в итоге тогда окажутся напрасной тратой времени, нет? 0

@Galphimbl 22 / 22 / 13 Регистрация: 13.01.2013 Сообщений: 125
	29.04.2013, 16:35
	если вы устанавливаете ширину/высоту в зависимости от окна браузера, почему бы вам просто не поставить ее в процентном соотношении? 0