jquery - 在 div 的高度上触发 CSS 动画

Question

我一直在尝试在滚动时触发 Animate.css 动画。我使用以下 jquery 代码在我的页面上进行管理。它工作正常:

    $(function() {

  var $window           = $(window),
      win_height_padded = $window.height() * 1.1,
      isTouch           = Modernizr.touch;

  if (isTouch) { $('.revealOnScroll').addClass('animated'); }

  $window.on('scroll', revealOnScroll);

  function revealOnScroll() {
    var scrolled = $window.scrollTop(),
        win_height_padded = $window.height() * 1.1;

    // Showed...
    $(".revealOnScroll:not(.animated)").each(function () {
      var $this     = $(this),
          offsetTop = $this.offset().top;

      if (scrolled + win_height_padded > offsetTop+300) {
        if ($this.data('timeout')) {
          window.setTimeout(function(){
            $this.addClass('animated ' + $this.data('animation'));
          }, parseInt($this.data('timeout'),10));
        } else {
          $this.addClass('animated ' + $this.data('animation'));
        }
      }
    });
    // Hidden...
   $(".revealOnScroll.animated").each(function (index) {
      var $this     = $(this),
          offsetTop = $this.offset().top;
      if (scrolled + win_height_padded < offsetTop) {
        $(this).removeClass('animated hinge fadeInLeft fadeIn pulse')
      }
    });
  }

  revealOnScroll();
});

但是我有一个打开全屏 div 的图像。在我的 div 中向下滚动时，我想使用相同的效果。

我试图用我的 div 的名称更改“window”，但它不起作用。

Answer 1

也许您的选择器不存在，请参阅 this