Comment obtenir la valeur de position de défilement d'un document?
$(document).height() //returns window height
$(document).scrollTop() //returns scroll position from top of document
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.
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.
document.getElementById("elementID").scrollHeight
$("elementID").scrollHeight
Il utilise des éléments HTML DOM, mais pas le sélecteur jQuery. Il peut être utilisé comme:
var height = document.body.scrollHeight;
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.
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
.
Essaye ça:
var scrollHeight = $(scrollable)[0] == document ? document.body.scrollHeight : $(scrollable)[0].scrollHeight;
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})