JQuery: как я могу вызвать событие, когда div появляется?

Ответ 1

Я думаю, вам придется подключиться к событию прокрутки и вручную проверить. Вот аналогичный вопрос:

Проверьте, видим ли элемент после прокрутки

Надеюсь, что это поможет.

Боб

Ответ 2

Плагин путевых точек охватывает это и многое другое. http://imakewebthings.com/jquery-waypoints/

Документы: http://imakewebthings.com/jquery-waypoints/#docs

например:

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

Ответ 3

Если вам нужно только запустить один раз:

$(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

  }
});

Полный ответ: https://www.thewebtaylor.com/articles/how-to-detect-if-an-element-is-scrolled-into-view-using-jquery

Ответ 4

Плагин jQuery, который добавляет связующее событие 'inview' для обнаружения, когда элемент прокручивается в представление.

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

Ответ 5

если вы хотите вызвать функцию в нижней части окна, поразить верхнюю часть вашего содержимого, вы можете использовать эту функцию:

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

или в нижней части экрана, в нижней части вашего содержимого, вы также можете использовать эту функцию:

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

он использует waypoint