Alerta de jQuery después de desplazarse 100 píxeles

Question

¿Es posible disparar una alerta después de que un usuario recorra 100 píxeles?

Esto es lo que tengo hasta ahora, pero sé que me falta algo;

$(window).scroll(function() { 
    if (document.documentElement.clientHeight + 
     $(document).scrollTop() == "100px") 
    { 
     alert("You've scrolled 100 pixels."); 
    } 
}); 

Answer 1

Observe la ventana .scrollTop (devuelve un número entero):

$(window).scroll(function() { 
    if ($(this).scrollTop() === 100) { // this refers to window 
     alert("You've scrolled 100 pixels."); 
    } 
}); 

pero si que se haya desplazado 102px no lo puedo activar el cuadro de alerta.

si lo que desea para activar la alerta una vez que una variable global que establece en true si se ha trigged:

$(function(){ 
    var hasBeenTrigged = false; 
    $(window).scroll(function() { 
     if ($(this).scrollTop() >= 100 && !hasBeenTrigged) { // if scroll is greater/equal then 100 and hasBeenTrigged is set to false. 
      alert("You've scrolled 100 pixels."); 
      hasBeenTrigged = true; 
     } 
    }); 
}); 

o simplemente desenlazar el evento de desplazamiento una vez que el cuadro de alerta se ha trigged:

$(function(){ 
    $(window).bind("scroll.alert", function() { 
     var $this = $(this); 
     if ($this.scrollTop() >= 100) { 
      alert("You've scrolled 100 pixels."); 
      $this.unbind("scroll.alert"); 
     } 
    }); 
}); 

Answer 2

Prueba esto:

$(document).scrollTop() >= 100) { 
    // ... 
} 

scrollTop() devuelve un entero. Esta versión se evaluará como verdadera una vez que haya desplazado pasado 100px, que podría ser más apropiado.

Answer 3

tratar

document.documentElement.clientHeight + $(document).scrollTop() == 100