淡出第一个 div，然后淡入第二个 div

遇到一个问题，我需要做一些类似淡入淡出横幅的事情 - 一个 div 淡出，然后第二个 div 淡入，代码如下：

$(document).ready(function() {
    setTimeout(function() {
        $('#zeus').fadeOut(1000);
     }, 5000);
    $('#zeuss').hide();
    setTimeout(function(){
        $('#zeuss').fadeIn(1000);
    }, 6000);
});

它有效，但是之后#zeuss淡入然后它就留在这里。我需要反复这样做。并且请不要提供使用 .delay() 因为我在 jquery 1.3.2

EDIT.默认情况下#zeus页面上显示，我想将其淡出然后淡入#zeuss，然后再次淡入#zeus然后淡出#zeus并淡入#zeuss etc..

通常情况下，通用且可扩展的解决方案会更简单：

更新：采纳了 jfriend00 的建议，从多个计时器转移到完成功能，以防止随着时间的推移出现累积错误。

/**
 * Fade-cycles elements with class 'banner'
 */
$(document).ready(function() {

    var delay = 3000, fade = 1000; // tweak-able
    var banners = $('.banner');
    var len = banners.length;
    var i = 0;

    setTimeout(cycle, delay); // <-- start

    function cycle() {
        $(banners[i%len]).fadeOut(fade, function() {
            $(banners[++i%len]).fadeIn(fade, function() { // mod ftw
                setTimeout(cycle, delay);
            });
        });
    }

});

• DEMO http://jsfiddle.net/paislee/pdsu7/5/使用 jQuery 1.3.2