该函数看起来像这样，我使用了jQuery animate函数try，但是我认为CSS过渡也可以做到这一点:)
$('a').on('click', function() { // click menu
$('.animate_item').each(function() {
$(this).fadeOut(fade_out_delay, function(){ // alot of animate_item start fadeout, delay time from html value data-delay
$('.another_animate_item').each(function() { // after animate_item all fadeout, alot of another_animate_item fadein
$(this).fadeIn(fade_in_delay);
});
});
});
});
每个动画项目都有延迟时间，如何检测所有动画项目淡出是否完成并执行回调？
我在想...
手动设置更长的功能延迟时间可能会起作用，但这是手动的:(
获得动画项目的最大数据延迟时间，并自动设置功能延迟可能更好？
还是其他聪明的方法？
非常感谢 ：）
尝试
$('a').on('click', function() { // click menu
var len = $('.animate_item').length;
$('.animate_item').each(function(i, el) {
// alot of animate_item start fadeout,
// delay time from html value data-delay
$(this).fadeOut($(this).data("delay"), function() {
if (i === len - 1) {
console.log("abc")
// do stuff
}
// after animate_item all fadeout,
// alot of another_animate_item fadein
// $('.another_animate_item').each(function() {
// $(this).fadeIn(fade_in_delay);
// });
});
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<a>click</a>
<div class="animate_item" data-delay="1000">a</div>
<div class="animate_item" data-delay="1000">b</div>
<div class="animate_item" data-delay="1000">c</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句