淡入/淡出jQuery列表 [英] Fading in/out a jquery list
本文介绍了淡入/淡出jQuery列表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试编写一个jquery函数,该函数遍历无序列表(具有id"intro"的ul元素),并分别淡入和淡出每个元素.这是行不通的,但是在开发人员工具中我没有收到任何错误.我还尝试将var list = $("#intro");
更改为var list = $("#intro li");
,但也没有与此相关的骰子
I'm trying to write a jquery function that loops through an unordered list (the ul element having the id "intro") and individually fades in and fades out each element. This doesn't work, but I get no errors in the developer tools. I also tried changing var list = $("#intro");
to var list = $("#intro li");
but no dice with that either
<script type = "text/javascript">
function startAnimations(){
var list = $("#intro");
list.hide();
list.each(function(li) {
$(li).fadeIn(3000, function(){
$(li).fadeOut(3000);
});
});
}
</script>
由于要求提供html:
Since the html was asked for:
<body onload="startAnimations()">
<div class = "container">
<div id = "inner"> </div>
<div id = "right-col">
<ul id = "intro">
<li id = "greeting"> <h2 > sometext </h2> </li>
<li id = "sidenote"> <h6 > sometext </h6> </li>
<li id = "sentence"> <h3 > sometext </h3> </li>
<li id = "sentence"> <h3 > sometext</h3> </li>
<li id = "sentence"> <h3 > sometext</h3> </li>
</ul>
</div>
</div>
</body>
推荐答案
尝试
function startAnimations() {
$("#intro li").hide();
function loop() {
var $li = $("#intro li:first-child").fadeIn(3000, function () {
$li.fadeOut(3000, function () {
$li.appendTo('#intro');;
loop()
})
});
}
loop()
}
演示:小提琴
这篇关于淡入/淡出jQuery列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文