jquery $ (window) .height () restituisce l'altezza del documento

104

Sono sicuro che sto commettendo un semplice errore, ma sto semplicemente avvisando $(window).height()e restituisce lo stesso valore di $(document).height().

Ho un MBA da 13 "e l'altezza della finestra del mio browser quando è ingrandita è compresa tra 780px e 820px (approssimativamente), ma ogni volta restituisce un'altezza della finestra identica a quella del documento. In ogni caso sul sito su cui sto lavorando è oltre 1000 px.

Che cosa sta succedendo qui?

alert($(window).height());
alert($(document).height());

jquery

— Fraser
fonte

qual è il browser su cui stai lavorando?

— Kanishka Panamaldeniya

Questo problema ha iniziato ad apparire con jquery-1.8.0, le versioni precedenti di jquery lo facevano correttamente (anche senza il set DOCTYPE)

— ralhei

245

Senza doctypetag, Chrome riporta lo stesso valore per entrambe le chiamate.

L'aggiunta di un doctype rigoroso come <!DOCTYPE html>fa sì che i valori funzionino come pubblicizzato.

Il doctypetag deve essere la molto prima cosa nel documento. Ad esempio, non puoi avere alcun testo prima di esso, anche se non visualizza nulla.

— Tom Hubbard
fonte

11

FireFox fa anche questo rapporto a meno che non utilizzi un doctype rigoroso come <! DOCTYPE HTML>

— Tom Chiverton

inoltre, un doctype errato fa sì che twitter bootstrap scrollspy agisca in modo strano per lo stesso motivo per cui $ (window) .height () restituisce l'altezza del documento.

— nidheeshdas

3

Nel mio caso, avevo un Response.Writecodice nel mio codice su un sito ASP che emetteva un 1prima di qualsiasi HTML. Quindi il mio tipo di documento era giusto, ma tecnicamente non era la prima cosa sulla pagina.

— James

1

ho lo stesso problema ma doctype è dichiarato correttamente :(

— bia.migueis

1

" Il tag doctype deve essere la prima cosa nel tuo documento. Ad esempio, non puoi avere alcun codice php prima di esso, anche se non esegue il rendering di nulla. " Come può essere? Il browser non sa cosa è in esecuzione il server, riceve solo un file di testo con markup HTML. Cosa succede se si esegue IIS e non Apache? Al browser non interessa cosa sta facendo il server.

— Sablefoste

24

Ho avuto lo stesso problema e l'utilizzo di questo lo ha risolto.

var w = window.innerWidth;
var h = window.innerHeight;

— Eduardo
fonte

1

così strano, sto usando anche il doctype appropriato. la tua altezza interiore ha risolto il mio problema! Grazie

— Martijn van Hoof

1

Lo stesso problema: aveva doctype valido e tutto il resto. Leggermente più multipiattaforma:

var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;

— melanie johnson

— risolvendo

1

Penso che il tuo documento debba avere abbastanza spazio nella finestra per visualizzarne il contenuto. Ciò significa che non è necessario scorrere verso il basso per visualizzare altre parti del documento. In tal caso, l'altezza del documento sarebbe uguale all'altezza della finestra.

— Xmindz
fonte

Il documento si estende sotto la parte inferiore della finestra in ogni pagina.

— Fraser

0

Ecco una domanda e una risposta per questo: Differenza tra screen.availHeight e window.height ()

Ha anche delle foto, quindi puoi effettivamente vedere le differenze. Spero che questo ti aiuti.

Fondamentalmente, $(window).height()ti dà l'altezza massima all'interno della finestra del browser (viewport) e $(document).height()ti dà l'altezza del documento all'interno del browser. Il più delle volte saranno esattamente gli stessi, anche con le barre di scorrimento.

— Solomon Closson
fonte

0

Funziona davvero se usiamo Doctype sulla nostra pagina web jquery (finestra) restituirà l'altezza del viewport altrimenti restituirà l'altezza completa del documento.

Definisci il seguente tag nella parte superiore della tua pagina web: <!DOCTYPE html>

— Gourav Yadav
fonte

usa questo tag nella parte superiore della tua pagina web: <! DOCTYPE html>

— Gourav Yadav