jQuery淡入淡出div超過2個div

Question

我正在嘗試為具有3個不同鏈接的網站創建jQuery淡入/淡出橫幅。 我已經成功使用了以下答案： 單擊時使用jquery進行淡入淡出div的簡單淡入淡出，以使其中兩個鏈接起作用，但第三個卻遇到了麻煩。
這是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"錨點。 我更新了您的小提琴，現在可以使用： http : //jsfiddle.net/vD77F/31/

Answer 2

您的網頁上有重復的ID，這是無效的HTML：

<a href="#" class="white" id="btn3">Trusted Quality</a>

我猜測jQuery要么無法運行，要么僅在它找到與ID匹配的第一個元素上運行。 嘗試更改ID，以使其具有唯一性，並使您更接近。