jQuery: Benachrichtigung über sichtbare HTML-Elemente

Question

Ich möchte in der Lage sein, herauszufinden, wann ein Seitenelement auf dem Bildschirm des Betrachters ein- oder ausgeschaltet ist. Insbesondere möchte ich in der Lage sein, ein html 5 Leinwand (Processing.js) Skript "auszuschalten", wenn der Benutzer über die Leinwand und zurück auf gescrollt hat, wenn es wieder in den Benutzer-Browser sichtbar ist.

Ergibt das einen Sinn? Ich denke, dass es irgendeine Möglichkeit für das DOM, um eine Benachrichtigung über Ajax zum Ein- und Ausschalten der Leinwand-Skript abzufeuern sein muss.

Danke.

/////////// EDIT (endgültiger Code) ////////// Hier ist der endgültige Code, den ich verwendet habe:

$(window).bind('scroll', function(){
   var $canvas = $('#canvas');
   var pos     = $canvas.offset();
   var total = pos.top + $($canvas).height();
   var wndtop  = $(this).scrollTop();

   if(wndtop <= pos || wndtop >= total ){ 

   }

});

Answer 1

Sie können einen Ereignishandler an die window scrolling . Wie

$(window).bind('scroll', function(){
   var $canvas = $('#hlogo');
   var pos     = $canvas.offset();
   var wndtop  = $(this).scrollTop();
   var wndleft = $(this).scrollLeft();

   if(wndtop <= pos.top && wndleft <= pos.left)
      $canvas.hide();
});

Answer 2

Das können Sie mit Hilfe von DOM-Eigenschaften erreichen element.y , element.style,height y window.scrollY .

Answer 3

Sie sollten in der Lage sein, den Code im untenstehenden Link an Ihre Bedürfnisse anzupassen. Prüfen, ob das Element nach dem Scrollen sichtbar ist