$ (window) .scrollTop () contre $ (document) .scrollTop ()


Réponses:


149

Ils vont tous les deux avoir le même effet .

Cependant, comme indiqué dans les commentaires: $(window).scrollTop()est pris en charge par plus de navigateurs Web que $('html').scrollTop().


3
il renvoie 0 dans IE8 (bien que ma page soit en mode bizarreries, ce qui peut jouer un facteur)
Greg Ogle

38
$ ('html'). scrollTop () n'est pas multi-navigateur (en tant que setter, cela ne fonctionne pas du moins dans Chrome). Pour le moment, la manière la plus transversale de le faire est: $ (window) .scrollTop () en tant que getter, $ ('html, body'). ScrollTop (offset) en tant que setter.
Georgii Ivankin

6
Selon cette référence , sans arguments, scrollTopne défile nulle part, mais renvoie simplement l'emplacement de défilement actuel.
OR Mapper

3
@ d2burke scrollTop()est un getter et scrollTop(value)un setter. scrollTop()sans arguments ne modifie pas la position de défilement.

1
@ M98 window.scrollTo (x, y)
Bodman

36

Tout d'abord, vous devez comprendre la différence entre windowet document. L' windowobjet est un objet côté client de niveau supérieur. Il n'y a rien au-dessus de l' windowobjet. JavaScript est un langage orienté objet. Vous commencez avec un objet et appliquez des méthodes à ses propriétés ou aux propriétés de ses groupes d'objets. Par exemple, l' documentobjet est un objet de l' windowobjet. Pour changer la document« couleur d'arrière - plan, vous souhaitez définir le document» s bgcolorpropriété.

window.document.bgcolor = "red" 

Pour répondre à votre question, il n'y a aucune différence dans le résultat final entre windowet document scrollTop. Les deux donneront le même résultat.

Vérifiez l'exemple de travail sur http://jsfiddle.net/7VRvj/6/

En usage général documentprincipalement pour enregistrer les événements et utiliser windowpour faire des choses comme scroll, scrollTopet resize.


Aucune différence dans le résultat final. Les deux donneront le même résultat.
Hussein

Apprentiement non, certains navigateurs ne prennent pas en charge le défilement de fenêtre car l'objet de la fenêtre peut ne pas être l'objet qui déborde.
Bodman

11
Quel navigateur ne prend pas en charge la fenêtre, soyez précis. Voici un exemple jsfiddle.net/7VRvj/4 . Vérifiez-le dans tous les navigateurs et indiquez-moi sur quel navigateur il ne fonctionne pas.
Hussein


0

J'ai juste eu quelques-uns des problèmes similaires avec scrollTop décrits ici.

En fin de compte, j'ai contourné cela sur Firefox et IE en utilisant le sélecteur$('*').scrollTop(0);

Pas parfait si vous avez des éléments que vous ne voulez pas appliquer, mais cela contourne la disparité entre les documents, le corps, le HTML et la fenêtre. Si ça aide ...


20
Vous ne devriez jamais utiliser * de cette façon (en fait, éviter complètement *). Au lieu de cibler un élément, vous affectez l'ensemble du DOM. Énorme succès de performance. Les sélecteurs doivent être aussi précis que possible.
Vlad

2
Personnellement, j'ai toujours utilisé $("html,body").scrollTop(val)- jamais eu de problèmes
Roi
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.