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名称更改“窗口”，但它不起作用。

Answer 1

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

在div的高度触发CSS动画

1 个答案: