2013-03-28 9 views
5

Il seguente codice viene utilizzato per rilevare se un utente ha spostato fino alla fine della pagina e funziona

if($(window).scrollTop() == $(document).height() - $(window).height()){ 
//do something 
} 

Problema:

Non capisco il motivo per cui si sottrae l'altezza della finestra dalla altezza del documento, quindi confrontare che all'altezza di scorrimento per determinare se il fondo di la pagina è stata raggiunta. Perché non è semplicemente

if($(window).scrollTop() == $(document).height()){ 
//do something 
} 

o

if($(window).scrollTop() == $(window).height()){ 
//do something 
} 

risposta

12

Questo perché $(window).scrollTop() restituisce la posizione della parte superiore della pagina, e $(document).height() restituisce la posizione della parte inferiore della pagina. Pertanto è necessario sottrarre l'altezza della finestra per ottenere la posizione da confrontare, in quanto ciò ti darà la posizione in cui si troverebbe la parte superiore della pagina se fossi completamente scostato verso il basso.

+0

Grazie. Giusto al punto. chiaro e conciso. –

+0

quindi come posso cambiarlo da finestra a div piuttosto particolare, invece? sostituire (finestra) con ('#scrollbar')? potresti dirmi la sintassi corretta, grazie :) –

+0

Credo che quanto segue sia corretto, potresti voler controllare il cross browser perché ho provato solo in chrome: http://jsfiddle.net/e1uxn46k/. In sostanza si fa una cosa molto simile ma si controlla la spaziatura di scorrimento del div su scrolltop + innerheight. – CodePB

0

Il valore scrollTop non sarà mai alto come il valore di altezza del documento. Ciò significherebbe che hai passato il documento in modo che fosse tutto fuori dalla finestra.

La comparazione di scrollTop all'altezza della finestra significherebbe solo lo scorrimento di uno schermo verso il basso, non verso il basso del documento.

Sottrarre l'altezza della finestra dall'altezza del documento fornisce il valore di scrollTop quando la parte inferiore della finestra si trova nella parte inferiore del documento.

3

$(window).scrollTop() è l'ubicazione dello superiore della finestra relativa al documento. Nella pagina che sto guardando in questo momento, è 1385 se riesco a scorrere fino in fondo. $(document).height() è l'altezza dell'intera pagina (1991 per me). $ (finestra) .height() è l'altezza della finestra (viewport) (606 per me). Ciò significa che la posizione della parte superiore della finestra più l'altezza della finestra è la posizione di inferiore della finestra. 1385 + 606 = 1991.