javascript - jQuery 淡入淡出 div 点击超过 2 个 div

Question

我正在尝试为一个有 3 个不同链接的网站创建一个 jQuery 淡入/淡出横幅。我已经成功使用了以下答案 Simple fade in fade out div with jquery on click获得 2 个链接，但我在使用第三个时遇到了问题。
这是 jQuery 代码:

$('#btn2').click(function (e) {
    $('#home_splash1').fadeOut('slow', function () {
        $('#home_splash2').fadeIn('slow');
    });
});

$('#btn1').click(function (e) {
    $('#home_splash2').fadeOut('slow', function () {
        $('#home_splash1').fadeIn('slow');
    });
});

$('#btn3').click(function (e) {
    $('#home_splash1').fadeOut('slow', function () {
        $('#home_splash3').fadeIn('slow');
    });
});

HTML/CSS 代码非常冗长，因此我将发布指向 jsfiddle 的链接，其中包含所有代码 http://jsfiddle.net/u2NGy/
任何帮助将不胜感激!

Answer 1

你需要写

$('#btn2').click(function(e){    
    $('#home_splash1, #home_splash3').fadeOut('slow', function(){
        $('#home_splash2').fadeIn('slow');
    });
});

代替

$('#btn2').click(function(e){    
    $('#home_splash1', '#home_splash3').fadeOut('slow', function(){
        $('#home_splash2').fadeIn('slow');
    });
});

您还有两个带有 id="btn3" 的 anchor 。我更新了你的 fiddle ，它现在可以工作了:http://jsfiddle.net/vD77F/31/