jQuery代碼的新手幫助-我需要阻止最后一個列表元素淡出

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

演示版

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個以上的元素，則可能會出錯，但是我想給您這個主意:)