逐个淡出多个元素

发布于 2024-08-27 11:19:06 字数 255 浏览 7 评论 0原文

是否有任何可能的解决方案来 fadeIn(500) 多个列表元素一个接一个?

<ul id="list">
 <li>test</li>
 <li>test</li>
 <li>test</li>
 <li>test</li>
 <li>test</li>
</ul>

Is there any possible solution, to fadeIn(500) multiple list elements one after the other?

<ul id="list">
 <li>test</li>
 <li>test</li>
 <li>test</li>
 <li>test</li>
 <li>test</li>
</ul>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

败给现实 2024-09-03 11:19:06

您可以执行一个递归函数,在没有 LI 时停止,如下所示:

function fadeLI(elem) { 
  elem.fadeIn(500, function() { fadeLI($(this).next()); }); 
}                            
fadeLI($("#list li:first")​);​

在此处查看

You could do a recursive function that stops when there's no LI left like this:

function fadeLI(elem) { 
  elem.fadeIn(500, function() { fadeLI($(this).next()); }); 
}                            
fadeLI($("#list li:first")​);​

Check it out here

故人爱我别走 2024-09-03 11:19:06

您需要一个递归函数来检查是否存在另一个 li 元素,如果有则将其淡入......

function fadeInNext(el){
  if(el.next('li')){
    el.next('li').fadeIn(500,fadeInNext)
  }
}
$('...').fadeIn( 500, fadeInNext )

You want a recursive function to check if there is another li element, and fade it in if so...

function fadeInNext(el){
  if(el.next('li')){
    el.next('li').fadeIn(500,fadeInNext)
  }
}
$('...').fadeIn( 500, fadeInNext )
—━☆沉默づ 2024-09-03 11:19:06

你可以这样做..将每个孩子添加到一个数组中并
创建一个函数来查看数组的长度是否大于 0,
然后它得到数组的第一个项目,fadeToggle 是子元素,它又是 fadeToggle 中的一个函数,它跳转到下一个子元素。有关 shift() 的更多信息,请查看 http://www.w3schools.com/jsref/jsref_shift.asp

var toggleList = [];
$("#container").children().each(function() {
toggleList.push(this);
});

function fadeToggleList(toggleList) {
if (toggleList.length > 0) {
    var currentChild = toggleList.shift();
    $(currentChild).fadeToggle(50, function() {
        fadeToggleList(toggleList);
    });
}
}
fadeToggleList(toggleList);

you can do this.. add each child into a array and
make a function which see's if the length of the array is greater then 0,
then it get's the first item of the Array and fadeToggle's the child which in turn toggle's a function within the fadeToggle and it jumps to the next child element.. for more information about shift() check out http://www.w3schools.com/jsref/jsref_shift.asp

var toggleList = [];
$("#container").children().each(function() {
toggleList.push(this);
});

function fadeToggleList(toggleList) {
if (toggleList.length > 0) {
    var currentChild = toggleList.shift();
    $(currentChild).fadeToggle(50, function() {
        fadeToggleList(toggleList);
    });
}
}
fadeToggleList(toggleList);
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文