[英]jQuery show/hide each element in list
The problem is that I want to change innerHTML propery of for each name in list and animate it with (fadeIn,delay for x sec,fadeOut) 问题是我想更改列表中每个名称的innerHTML属性,并用(fadeIn,x sec的延迟,fadeOut)对其进行动画处理
<div id="welcomeBox">Welcome SOMETHING</div>
var list = ["George","Bob","Tom"];
$.each(list, function()
{
$("#welcomeBox")
.eq(0)
.text('Welcome' + this)
.fadeToggle(1500)
.delay(5000)
.fadeToggle(1500);
});
With code above I just get 3x Welcome Tom message. 使用上面的代码,我只会收到3倍的Tom Tom消息。
var list=["George","Bob","Tom"];
// recursive closure to iterate thru list
(function recurse(index){
// on fade use the callback to fade out
$("#welcomeBox").text('Welcome ' + list[index]).fadeIn(1500, function(){
$("#welcomeBox").fadeOut(1500, function(){
// after fade out, call the function again with the next index
recurse(undefined !== list[index+1] ? index+1 : 0);
});
});
})(0);
https://jsfiddle.net/6qo0L6mr/ https://jsfiddle.net/6qo0L6mr/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.