JQuery (окно). Неточность

Я делаю простой тест на $(window).height(), и я получаю значение 2602 при разрешении экрана 1366 x 768.

jQuery(document).ready(function($){

    var W = $(window).width();
    var H = $(window).height();

    console.log('W ' + W);
    console.log('H ' + H);

}

Выходы:

W 1226 H 2602

Любые советы по отладке этого или того, что я делаю неправильно?

EDIT: использование хрома и FF

Я буквально набираю это в консоли: jQuery (window).height();

Ответ 1

Собственно, это было результатом скрытого элемента div на моей странице. У меня было толстое соединение, которое вытащило бы этот скрытый контент. Удаление этого исправлено jQuery.width()!

Удивительно, но не уверен, что это полезно, но это действительно ответ.

Ответ 2

Это может быть так же просто, как отсутствующий или некорректный DOCTYPE (затронутый Chrome, но не IE).

Интересно, что это даже не проблема jQuery - она ​​также влияет на document.documentElement.clientHeight.

Без doctype:

enter image description here

С doctype:

<!DOCTYPE html>

enter image description here

Я думал, что на моей странице есть шаблон макета, но оказалось, что я этого не сделал - и поэтому не имел DOCTYPE.

Ответ 3

Вы все делаете правильно, и вы не получаете значения, которые вам нужны. Это не так, как должен себя вести jQuery.

На этой самой странице я проверил функции, которые вы вызывали, чтобы узнать, каковы будут их значения. Они точно отображали фактическую ширину и высоту видимой страницы в моем окне. Вот результаты.

Chrome со стандартной консолью разработчика

Some calls to the window width and height in jQuery, returning correct results for pixels on screen

Firefox, с Firebug

Some calls to the window width and height in jQuery, returning correct results for pixels on screen

Что-то не так на вашем конце

jQuery $(window).height() должен отображать видимый видовой экран. См. Документы в Функция высоты jQuery:

Этот метод также способен находить высоту окна и документа.

$(window).height(); // returns height of browser viewport
$(document).height(); // returns height of HTML document 

window.height - это настраиваемая ценность, на которую могут влиять вещи, но $(window).height() не влияет на изменения.

Что точно не так?

Что бы ни происходило, какую бы функцию вы вызывали, вы не вызываете реализацию jQuery $(window).height().

Используя консоль разработчика браузера, поместите точку останова в строке, где вы вызываете $(window).height(), и входите в вызов функции. Что на самом деле вызывается, когда вы вызываете $(window).height()? Вам нужно это выяснить.

Кто-нибудь заменил функцию высоты новой или лучшей?

Сильное подозрение в том, что какая-то часть базы кода, с которой вы работаете, прошла и сделала это:

// Replace jQuery height function with a better one to fix bug XYZ
$(window).height = function brandNewHeightFunction() {
    return someVeryWrongValue;
};

Если это так, когда вы входите в функцию высоты, он может фактически не входить в часть библиотеки jQuery, а в другую часть ваших собственных библиотек. Узнайте, что это необходимо, и посмотрите, что вы можете с этим поделать. Если вы просто удалите эту функциональность, другие вещи, в зависимости от того, что она работает, могут начать ломаться.

Кто-нибудь ушел и изменил/настроил вашу библиотеку jQuery?

Проверьте, не произошло ли это с кем бы вы ни были, и любыми имеющимися у вас средствами истории. Какую версию jQuery вы используете? Загрузите тот же самый из сайта jQuery, если это возможно, и посмотрите код, который вы видите при входе в функцию высоты окна, тот же, что вы там видите.

Загрузите jQuery и обратитесь к нему. Если ваша функция высоты окна внезапно начинает работать, кто-то может это сделать. Узнайте, почему это было настроено. Если вы его починили, другие вещи, зависящие от этого поведения, могут начать ломаться.

Ответ 4

Такая же проблема здесь выглядит, что jquery (и dom в целом) не правильно вычисляет размеры в quirksmode.

Два решения:

  • Добавить doctype html в верхней части страницы или
  • Используйте window.innerHeight, window.innerWidth, если первый параметр не является параметром.

Надеюсь, что это поможет.

Ответ 5

По моему опыту, $(document).height(); обычно является тем, что вы хотите в большинстве сценариев. Разница заключается в том, что если страница больше, чем окно (имеет полосы прокрутки), вы получите всю высоту всего прокручиваемого документа, а $(window).height() будет получать только высоту вкладки текущего размера.

Итак, если вы хотите, чтобы элемент занимал полный размер окна +, любая прокручиваемая область под слоем $(document).height - это путь.

Конечно, для обоих есть вариант использования.

Ответ 6

jquery использует clientWidth и height, который возвращает значение текущей отображаемой страницы, исключая пространство прокрутки, есть один из способов сделать ее точной переполнение: спрятанный в тег тела, тогда вы получите исходный размер видового экрана