web-dev-qa-db-fra.com

Comment puis-je obtenir la position de défilement d'un document?

Comment obtenir la valeur de position de défilement d'un document?

82
Somebody
$(document).height() //returns window height

$(document).scrollTop() //returns scroll position from top of document
46
Bob Gregor

Voici comment obtenir le scrollHeight d'un élément obtenu à l'aide d'un sélecteur jQuery:

$(selector)[0].scrollHeight

Si selector est l’id de l’élément (par exemple, elemId), il est garanti que l’élément indexé par 0 du tableau sera l’élément que vous souhaitez sélectionner et que scrollHeight sera correct.

177
Demwis

Si vous utilisez Jquery 1.6 ou une version ultérieure, utilisez prop pour accéder à la valeur.

$(document).prop('scrollHeight')

Les versions précédentes utilisaient la valeur attr mais pas la version 1.6.

45
Ankit
document.getElementById("elementID").scrollHeight

$("elementID").scrollHeight
6
Sachin R

Il utilise des éléments HTML DOM, mais pas le sélecteur jQuery. Il peut être utilisé comme:

var height = document.body.scrollHeight;
6
aqua

Quelque chose comme ceci devrait résoudre votre problème:

$.getDocHeight = function(){
     var D = document;
     return Math.max(Math.max(D.body.scrollHeight,    D.documentElement.scrollHeight), Math.max(D.body.offsetHeight, D.documentElement.offsetHeight), Math.max(D.body.clientHeight, D.documentElement.clientHeight));
};

alert( $.getDocHeight() );

Ps: Appelez cette fonction chaque fois que vous en avez besoin, l'alerte sert uniquement à des fins de test.

3
Zuul

Pour obtenir la hauteur de défilement réelle des zones défilées par la barre de défilement de la fenêtre, j'ai utilisé $('body').prop('scrollHeight'). Cela semble être la solution de travail la plus simple, mais je n'ai pas vérifié la compatibilité de manière approfondie. Emanuele Del Grande note une autre solution qui ne fonctionnerait probablement pas pour IE ci-dessous 8.

La plupart des autres solutions fonctionnent correctement pour les éléments défilables, mais cela fonctionne pour toute la fenêtre. Notamment, j'ai eu le même problème que Michael pour la solution d'Ankit, à savoir que $(document).prop('scrollHeight') renvoie undefined.

3
acjay

Essaye ça:

var scrollHeight = $(scrollable)[0] == document ? document.body.scrollHeight : $(scrollable)[0].scrollHeight;
1
Dmitry Komin

Vous pouvez essayer ceci par exemple, ce code place la barre de défilement au bas de toutes les balises DIV

Rappelez-vous: jQuery peut accepter une fonction à la place de la valeur en tant qu'argument. "this" est l'objet traité par jQuery, la fonction retourne la propriété scrollHeight de la DIV actuelle "this" et le fait pour toutes les DIV du document.

$("div").scrollTop(function(){return this.scrollHeight})
0
Steve