jQuery: Wie kann ich ein Ereignis auslösen, wenn ein div in Sicht kommt? [duplicate]

Lesezeit: 2 Minuten

Gibt es eine Möglichkeit, ein Ereignis mit jQuery auszulösen, wenn die Seite weit genug gescrollt wird, damit ein div sichtbar wird?

jQuery Wie kann ich ein Ereignis auslosen wenn ein div
Kaelden

Wenn Sie nur einmal feuern müssen:

$(window).scroll(function(){
  // This is then function used to detect if the element is scrolled into view
  function elementScrolled(elem)
  {
    var docViewTop = $(window).scrollTop();
    var docViewBottom = docViewTop + $(window).height();
    var elemTop = $(elem).offset().top;
    return ((elemTop <= docViewBottom) && (elemTop >= docViewTop));
  }

  // This is where we use the function to detect if ".box2" is scrolled into view, and when it is add the class ".animated" to the <p> child element
  if(elementScrolled('. box2')) {


  // Your function here

  }
});

Vollständige Antwort: https://www.thewebtaylor.com/articles/how-to-detect-if-an-element-is-scrolled-into-view-using-jquery

  • Als Optimierung halte ich das elementScrolled Die Funktion sollte aus dem Scroll-Callback entfernt werden: 1. Es besteht keine Notwendigkeit, die Funktion für jeden einzelnen Frame, den das Browserfenster scrollt, neu zu definieren – eine enorme Verschwendung; und 2. Es sieht aus wie eine praktische Funktion für andere Gegenstände.

    – weißer Turm6

    24. März 21 um 20:01 Uhr

1643323266 553 jQuery Wie kann ich ein Ereignis auslosen wenn ein div
Raben

Ich denke, Sie müssen sich in das Scroll-Ereignis einklinken und manuell überprüfen. Hier eine ähnliche Frage:

Überprüfen Sie, ob das Element nach dem Scrollen sichtbar ist

Hoffentlich hilft das.

Bob

Das Waypoints-Plugin deckt dies und mehr ab.
http://imakewebthings.com/jquery-waypoints/

Dokumente: http://imakewebthings.com/jquery-waypoints/#docs

z.B:

$('.someSelector').waypoint(function(direction){
//do stuff 
},{
 //bottom-in-view will ensure event is thrown when the element's bottom crosses
 //bottom of viewport.
 offset: 'bottom-in-view'
});

  • Gutes Plugin – hat bei mir funktioniert

    – Jarin

    3. April 17 um 16:42 Uhr

Ein jQuery-Plugin, das ein bindbares „inview“-Ereignis hinzufügt, um zu erkennen, wann ein Element in die Ansicht gescrollt wird.

https://github.com/protonet/jquery.inview

Wenn Sie eine Funktion auslösen möchten, wenn Sie unten in der Ansicht oben auf Ihren Inhalt klicken, können Sie diese Funktion verwenden:

$('.ModuleWrapper').waypoint(function (direction) {
    // Codes Here
}, {
    offset: function () {
        return $(this).height();
    }
});

oder wenn Sie unten in der Ansicht auf das Ende Ihres Inhalts klicken, können Sie auch diese Funktion verwenden:

$('.ModuleWrapper').waypoint(function (direction) {
    // Codes Here
}, {
    offset: function () {
        return -1 * $(this).height();
    }
});

es benutzt Wegpunkt

.

666300cookie-checkjQuery: Wie kann ich ein Ereignis auslösen, wenn ein div in Sicht kommt? [duplicate]

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy