Размер высоты окна в JavaScript
Подробно о высоте окна в javascript
- Вывести с помощью clientHeight высоты body
- innerHeight — внутренняя высота окна.
- outerHeight — наружная высота окна.
- screen.height и screen.availHeight - высота экрана
Вывести с помощью clientHeight высоты body
Предположим, что нам требуется найти текущую высоты окна, которое занимает тег "body"
Для этого мы можем воспользоваться свойством:
Для "body" эта конструкция будет выглядеть так:
document.body.clientHeight
Далее нам потребуется как-то вывести результат работы "clientHeight" - это document.write
После этого соберем весь код вместе добавим туда еще и "script"
Результат получения высоты, которое занимает body:
Разместим выше приведенный пример прямо здесь.
Здесь выдается какое-то значение "body", но что-то оно не похоже на реальность... как минимум ещё на 2 надо умножить...
Поэтому проверим данное свойство относительно "элемента" - у которого заранее известна высота...
Пусть это будет div добавим id + style + width и border и получим:
Далее script + getElementById("is_id")
innerHeight — внутренняя рабочая часть окна.
Как мы будем использовать "innerHeight" - для определения внутренней высоты окна браузера.
Нам понадобится:
Тег script, внутрь помещаем document.write и уже во внутрь "innerHeight"
Соберем эту всю конструкцию вместе:
Как мы видим из результата, "innerHeight" получил высоты внутреннюю окна браузера.
Использование innerHeight для определения высоты другого элемента на сайте
Как я не пытался использовать "innerHeight" через чистый "javascript" для того, чтобы узнать высоты другого объекта - увы, у меня не получилось!
Мы можем использовать innerHeight() в jQuery
Выше мы уже использовали этот div и его же и будем использовать.
Не забываем, что нужно подключить jquery
Получаем объект - это равносильно "document.getElementById("is_id")"
Далее добавляем :
И чтобы вывести результат :
document.write
Соберем весь код получения высоты блока через innerHeight() в jQuery
<div id="is_id" style="width:500px; height:50px; border: 1px solid">Здесь текст </div>
<script> document.write( $( "#is_id" ).innerHeight() ) ;</script>
Результат выведем прямо здесь:
red
outerHeight — наружная высота окна.
outerHeight - отличается от выше приведенного пункта тем, что это свойство определяет высоты наружного блока.
Проделаем абсолютно те же действия, что и в предыдущем пункте только заменим "innerHeight" на "outerHeight"
Результат:
outerHeight() в jQuery
Также меняем "innerHeight" на "outerHeight"
Выше был размещен наш div:
<div id="is_id" style="width:500px; height:50px; border: 1px solid">Здесь текст </div>
<script> document.write( $( "#is_id" ).innerHeight() ) ;</script>
screen.height и screen.availHeight - высота экрана
У нас остались еще "screen.height" и screen.availHeight
screen.height — разрешение экрана по горизонтали.
Результат:
screen.availHeight — доступная область эркана для окон. Не учитывает служебные панели операционной системы, например, панель задач в Windows.
Результат:
высота javascript
высота окна javascript
javascript высота экрана
высота элемента javascript
javascript получить высоты
высота браузера javascript
javascript высота окна браузера
поиск в высоты javascript
как узнать высоты окна браузера javascript
javascript изменить высоты asyncfileupload
как получить высоты экрана javascript
javascript высота элемента в пикселях

подробнее.
подробнее.