Question

我正在使用aniCollection使页面加载时三个框淡入+向上滑动。它到目前为止一直很好用，但我想我会尝试让盒子一次出现一个以获得更好的视觉效果。这是slideup + fadein的aniCollection代码：

var element = $('#square');

element.mouseover(function(){
element.toggleClass('fadeInUp animated');
element.one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(e){
     $(e.target).removeClass('fadeInUp animated');
  });
});

这是我尝试使用.delay(counter)单独延迟每个框：

var counter = 0;
var welcomeBoxes = $('#welcomeBoxes');
welcomeBoxes.each(function(){
    counter += 300;
    $(this).delay(counter).toggleClass('fadeInUp animated');
    $(this).delay(counter).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function(e){
        $(e.target).removeClass('fadeInUp animated');
    });
})

运行时没有任何变化。盒子仍然同时淡入。任何帮助将不胜感激。

Answer 1

1st：正如我在评论中说的那样.Id必须是唯一的..所以不要对多个元素使用相同的ID .. use class=""而不是{{1} }

更改为课程后，

第二名：您可以像这样循环上课

id=""

在'this'

1 个答案: