2013-04-30 215 views
0

我試圖用jQuery製作一個簡單的菜單,但似乎我做錯了任何人都可以告訴我什麼即時做錯了...我檢查其他線程,但我找不到解決這個問題的方法,感謝您的時間傢伙jquery在兩個按鈕之間切換

<nav id="header"> 
    <ul> 
    <li class="one"><a href="#">one</a></li> 
    <li class="two"><a href="#">two</a></li> 
    </ul> 
    </nav> 
    <div class="one-div"> 
    <div> 
    <h1>title</h1> 
    <p>text here</p> 
    </div> 
    </div> 
    <div class="two-div"> 
    <div> 
    <h1>title</h1> 
    <p>text here</p> 
    </div> 
    </div> 
    </code> 

    // in the css of the div i got the display:"none"; 

    $('.one').click(function() { 
    if ($(".one-div").is(":hidden")) { 
    $(".one-div").slideDown("slow"); 
    } else { 
    $(".one-div").hide(); 
    } 
    }); 

    $('.two').click(function() { 
    if ($(".two-div").is(":hidden")) { 
    $(".two-div").slideDown("slow"); 
    } else { 
    $(".two-div").hide(); 
    } 
    }); 
+0

你不能有相同的ID兩個元素'header'。 – Barmar 2013-04-30 00:03:10

+2

你有什麼問題? – Barmar 2013-04-30 00:03:26

+0

點擊第一個我喜歡隱藏它之前顯示第二個......這就是我的主要問題:) – 2013-04-30 00:04:37

回答

3

CSS

.one { display:block; } 
.two { display:none; } 

JS

var buttons = $(".one,.two").on("click", function(){ 
    buttons.slideToggle(); 
}) 
+0

'.one'和'.one-div'不是一回事。 – Barmar 2013-04-30 00:07:08

+0

感謝這就是我需要:) – 2013-04-30 00:15:35