jQuery 淡入和淡出循环回到 :first sibling

标签 jquery fadein fadeout

JS Fiddle 位于此处:http://jsfiddle.net/8nqkA/2/

HTML

<div>
<div class="show">Test 1</div>
<div class="hidden">Test 2</div>
<div class="hidden">Test 3</div>
<div class="hidden">Test 4</div>
</div>

jQuery

$(document).ready(function() {
    myFunc($(".show"));
});

function myFunc(oEle)
{
       oEle.fadeOut('slow', function(){
            if (oEle.next())
            {
                oEle.next().fadeIn('slow', function(){
                   myFunc(oEle.next());
                });
            }
           else
               oEle.siblings(":first").fadeIn('slow', function(){
               myFunc(oEle.siblings(":first"));
               });
        });
}

CSS

.hidden {
    display: none;
}

尝试让它在完成后循环回到测试 1,但不起作用。只是想让一切重新开始,这有什么问题吗?

最佳答案

if (oEle.next()){ // This needs to be oEle.next().length
    oEle.next().fadeIn('slow', function(){
        myFunc(oEle.next());
    });
}else{ // You should wrap this in a block
    oEle.siblings(":first").fadeIn('slow', function(){
        myFunc(oEle.siblings(":first"));
    });
}

我们测试 .length 的原因是因为 .next() 与大多数 jQuery 方法一样,返回 jQuery - 无法直接对其进行测试。您可以将其视为一个数组,因此 .length 属性为我们提供了当前选择中有多少个元素。

我们还应该将您的 else 代码包装在一个 block ({..}) 中,因为以下代码跨越多行。

关于jQuery 淡入和淡出循环回到 :first sibling,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14994212/

相关文章:

css - 图像彼此重叠,同时居中垂直。和贺

jQuery 淡入 CSS 类

javascript - 无限滚动,回调jquery函数

javascript - 我怎样才能在我的 jquery 代码中加入淡入淡出效果

javascript - 多 div 的动画滚动顶部问题

javascript - jquery 淡入淡出。

jquery 褪色 图片

jquery - 如何在页面加载一段时间后淡出 div 的边框和背景颜色?

jquery - 使周围的DIV在子div改变大小后平滑调整

javascript - "Driving"使用 javascript/jquery 到位效果