我想遍历一个数组,然后淡出每个数组。但是,如果该数组中的索引应该包含它自己的数组,我希望外部数组停止;然后动画它的内部数组;然后继续。
我提供了一个jsfiddle
我知道它现在是各种意大利面条,但我打算把它变成一个函数,在 if 语句中调用另一个函数。但是现在我对如何让它正确停止有点困惑。
$(document).ready(function() {
// start
var elements = $('.switch');
elements.each(function(index) {
var element = $(this);
setTimeout(function() {
element.fadeIn(1000, function() {
if(element.has('.section')){
var innerEls = $('.section');
innerEls.each(function(i) {
// stuff
var inner = $(this);
setTimeout(function() {
element.stop();
inner.fadeIn(1000).delay(2000).fadeOut(1000);
}, 4000 * i);
});
}
}).delay(1000).fadeOut(1000);
}, 2000 * index);
});
});
<div class="switch">This is <div> number 1</div>
<div class="switch">This is <div> number 2</div>
<div class="switch">This is <div> number 3
<div class="section">this</div>
<div class="section">needs to</div>
<div class="section">show</div>
</div>
<div class="switch">This is <div> number 4</div>
<div class="switch">This is <div> number 5</div>