jQuery在div之間淡入/淡出

Question

我有以下代碼：

var next = null;
    var outer = jQuery('.banner .container');
    var current = outer.find('.banner-word:first');
    current.fadeIn();
    function fade() {
        if (current.next('div.banner-word').length > 0) {
            next = current.next('div.banner-word');
        } else {
            next = outer.find('.banner-word:first');
        }
        current.fadeOut();
        next.fadeIn();
        current = next;
        setTimeout(fade, 11000);
    }
    // start the process
    fade();

它有一些問題-1）似乎忽略了第一個標題詞div 2）在加載時它迅速顯示了前2個標題詞div，然后以第二個標題詞div開始

我是否缺少明顯的東西？

Answer 1

嘗試更改：

if (current.next('div.banner-word').length > 0) {
    next = current.next('div.banner-word');
} else {
    next = outer.find('.banner-word:first');
}

至：

if (current.next().is('div.banner-word')) {
    next = current.next();
} else {
    next = outer.find('.banner-word:first');
}

編輯：嘗試向初始fade（）調用添加延遲。 更改

fade();

至

setTimeout(fade, 5000);