jquery $ (window) .height () возвращает высоту документа

104

Я уверен, что это простая ошибка, но я просто предупреждаю, $(window).height()и она возвращает то же значение, что и $(document).height().

У меня 13-дюймовый MBA, и моя высота окна в моих браузерах при максимальном увеличении составляет от 780 до 820 пикселей (примерно), но каждый раз он возвращает высоту окна, идентичную высоте документа. В каждом случае на сайте, над которым я работаю, это более 1000 пикселей.

Что здесь происходит?

alert($(window).height());
alert($(document).height());
jquery Fraser
источник
над каким браузером вы работаете?
Канишка Панамалдения
Эта проблема начала появляться с jquery-1.8.0, более старые версии jquery сделали это правильно (даже без набора DOCTYPE)
ralhei

Ответы:

246

Без doctypeтега Chrome сообщает одно и то же значение для обоих вызовов.

Добавление строгого типа doctype <!DOCTYPE html>заставляет значения работать так, как рекламируется.

doctypeТег должен быть очень первым , что в вашем документе. Например, перед ним не может быть текста, даже если он ничего не отображает.

Том Хаббард
источник
11
FireFox также делает это сообщение, если вы не используете строгий тип документа, например <! DOCTYPE HTML>
Том Чивертон
кроме того, неправильный doctype заставляет twitter bootstrap scrollspy вести себя странно по той же причине, что $ (window) .height () возвращает высоту документа.
nidheeshdas
3
В моем случае у меня был Response.Writeкод в моем коде на сайте ASP, который выводил 1перед любым HTML. Так что мой тип документа был правильным, но технически это не было первым делом на странице.
Джеймс
1
у меня такая же проблема, но doctype объявлен правильно :(
bia.migueis
1
« Тег doctype должен быть самым первым в вашем документе. Например, вы не можете иметь перед ним какой-либо php-код, даже если он ничего не отображает ». Как такое может быть? Браузер не знает, на чем запущен сервер, он получает только текстовый файл с разметкой HTML. Что делать, если вы используете IIS, а не Apache? Браузеру все равно, что делает сервер.
Sablefoste 08
24

У меня была такая же проблема, и это решило ее.

var w = window.innerWidth;
var h = window.innerHeight;
Эдуардо
источник
1
так странно, я также использую правильный doctype. ваша внутренняя высота решила мою проблему! Спасибо
Martijn van Hoof
1
Та же проблема - действующий доктайп и все такое. Чуть более кроссплатформенный: var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
melanie johnson
действительно решает проблему (и да, у меня есть doctype - первое, что нужно на каждой странице)
hillcode
1

Я думаю, что в вашем документе должно быть достаточно места в окне для отображения его содержимого. Это означает, что нет необходимости прокручивать вниз, чтобы увидеть какую-либо часть документа. В этом случае высота документа будет равна высоте окна.

Xmindz
источник
Документ располагается ниже нижней части окна на каждой странице.
Fraser
0

Вот вопрос и ответ: разница между screen.availHeight и window.height ()

Также есть фотографии, так что вы можете увидеть различия. Надеюсь это поможет.

По сути, $(window).height()дайте вам максимальную высоту внутри окна браузера (области просмотра) и $(document).height()высоту документа внутри браузера. В большинстве случаев они будут точно такими же, даже с полосами прокрутки.

Соломон Клоссон
источник
0

Это действительно работает, если мы используем Doctype на нашей веб-странице. Jquery (window) вернет высоту окна просмотра, иначе он вернет полную высоту документа.

Определите следующий тег в верхней части своей веб-страницы: <!DOCTYPE html>

Гоурав Ядав
источник
используйте этот тег в верхней части своей веб-страницы: <! DOCTYPE html>
Гурав Ядав,