Question

现在已经回答了（感谢所有人）

我想阻止最后一个列表元素逐渐消失我在第一周使用jquery并且一直在尝试各种不同的状态并没有成功。我发现的所有代码似乎都希望递归遍历所有元素，这是我不想要的。我希望代码在最后一个项目结束时没有最后一个列表元素淡出。我知道所有的循环插件，但我只想要基本的功能。

感谢您的帮助，希望我没有违反任何规则，这是我的第一个问题。

我现在觉得有点愚蠢，我忘了添加我的CSS而且也没提到我希望每个列表元素都在前一个列表元素上淡化，因此绝对位置。我提交的3个解决方案效果很好，但我问错了，只是我没有正确解释事情，我道歉。任何进一步的帮助将非常感激。

The CSS I forgot first time around
#container ul li {
position:absolute;
display:none;
}     
<script type="text/javascript">

$(document).ready(function() {

(function hidenext(jq){
    jq.eq(0).fadeIn(1000).delay(5000).fadeOut(1000, function(){
        (jq=jq.slice(1)).length && hidenext(jq);
    });
})($('div#container ul li'))

});

</script>


<div id="container">


      <ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
      </ul>

</div>

Answer 1

试试这个

$(document).ready(function() {

(function hidenext(jq){
    jq.eq(0).fadeIn(1000).delay(5000).fadeOut(1000, function(){
        (jq=jq.slice(1)).length && hidenext(jq);
    });
})($('div#container ul li:not(:last)'))

});

Answer 2

您只需将> 1添加到停止条件即可。所以，从

改变

(jq=jq.slice(1)).length

到

(jq=jq.slice(1)).length > 1

Demo

Answer 3

试试这个;）

$('div#container ul li').not(':last').each(function(idx, elt) {
    idx++;
    $(elt).fadeIn(idx * 1000).delay(idx * 5000).fadeOut(idx * 1000);
});

http://jsfiddle.net/dzRsp/

修改这样的事情会更好：

$('div#container ul li').not(':last').each(function(idx, elt) { idx++; if (idx > 1) $(elt).delay(idx * 3000); $(elt).fadeIn(idx * 1000).delay(idx * 5000).fadeOut(idx * 1000, function() { if (idx + 1 == $('div#container ul li').size()) $('div#container ul li:last').fadeIn(1000); }); });

http://jsfiddle.net/dzRsp/1/

如果你有超过3个元素，那就是错误，但我想给你一个想法：）

新手帮助Jquery代码 - 我需要阻止最后一个列表元素淡出

3 个答案: