Comment détecter la position de défilement d'une page à l'aide de jQuery ?

Question

J'ai des problèmes avec la fonctionnalité jQuery sur mon site web. Ce qu'il fait, c'est qu'il utilise le window.scroll() pour reconnaître quand la fenêtre change de position de défilement et, au moment du changement, appelle quelques fonctions pour charger les données du serveur.

Le problème est le suivant .scroll() est appelée dès qu'il y a le moindre changement dans la position de défilement et charge les données en bas de page ; cependant, ce que je souhaite réaliser, c'est charger de nouvelles données lorsque la position de défilement/page atteint le bas de page, comme c'est le cas pour le flux Facebook.

Mais je ne sais pas comment détecter la position de défilement à l'aide de jQuery ?

function getData() {
  $.getJSON('Get/GetData?no=1', function (responseText) {
    //Load some data from the server
  })
};

$(window).scroll(function () {
    getData();
});

Answer 1

Vous pouvez extraire la position de défilement à l'aide de la fonction jQuery .scrollTop() méthode

$(window).scroll(function (event) {
    var scroll = $(window).scrollTop();
    // Do something
});

Answer 2

Vous êtes à la recherche de la window.scrollTop() fonction.

$(window).scroll(function() {
    var height = $(window).scrollTop();

    if(height  > some_number) {
        // do something
    }
});

Answer 3

Voir ici DEMO http://jsfiddle.net/yeyene/Uhm2J/

function getData() {
    $.getJSON('Get/GetData?no=1', function (responseText) {
        //Load some data from the server
    })
};

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       alert("bottom!");
       // getData();
   }
});

Answer 4

$(window).scroll( function() { 
 var scrolled_val = $(document).scrollTop().valueOf();
 alert(scrolled_val+ ' = scroll value');
});

C'est une autre façon d'obtenir la valeur du défilement.

Answer 5

Maintenant, ça marche pour moi...

$(document).ready(function(){

    $(window).resize(function(e){
        console.log(e);                   
    });

    $(window).scroll(function (event) {
        var sc = $(window).scrollTop();
        console.log(sc);
    });

})

cela fonctionne bien... et vous pouvez ensuite utiliser JQuery/TweenMax pour suivre les éléments et les contrôler.