2013-04-07 63 views
0

我有人爲我寫了這個,並去了MIA,並無法弄清楚如何自己調整它。我對jQuery很陌生。這是用於使用<ul>的可擴展側邊欄導航,並且目前整個事情在點擊時可擴展和收縮。jQuery點擊功能ul菜單首先排除ul

我試圖讓第一個標題1 <ul>永久「展開」以顯示鏈接1和鏈接2,但保持jQuery在標題2(以及3,4,5等)上工作。

我該如何永久保持第一個<ul>開放?非常感謝幫助!

<div class="sidebar"> 
<nav> 
<span class="heading">Title 1</span> 
<ul> 
<li><a href="/firstlink">Link 1</a></li> 
<li><a href="/firstlink">Link 2</a></li> 
</ul> 
</nav> 

<nav> 
<span class="heading">Title 2</span> 
<ul> 
<li><a href="/firstlink">Link 1</a></li> 
<li><a href="/firstlink">Link 2</a></li> 
</ul> 
</nav> 
</div> 

這是jQuery的位,使得它膨脹和收縮:

jQuery(window).load(function(){ 
jQuery('#body .sidebar nav').click(function(){ 
    var the_ul = jQuery('> ul', this); 
    if(the_ul){ 
     if (the_ul.css('display') == 'none') { 
      jQuery(the_ul).slideDown('500'); 
     } else { 
      jQuery(the_ul).slideUp('500'); 
     } 
    }; 
}); 
}); 

這是CSS:

.sidebar nav ul {display:none;} 

回答

0

試試這個(http://jsfiddle.net/v7JhL/1/)和刪除CSS:

jQuery('#body .sidebar nav:gt(0)').click(function(){ 
    var the_ul = jQuery('> ul', this); 
    if(the_ul){ 
     if (the_ul.css('display') == 'none') { 
      jQuery(the_ul).slideDown('500'); 
     } else { 
      jQuery(the_ul).slideUp('500'); 
     } 
    }; 
}); 
jQuery('.sidebar nav > ul:gt(0)').hide() 
+0

謝謝。但其中的某些內容與網站上的其他內容相沖突並觸發了多種警報彈出窗口。 – user2254449 2013-04-07 13:21:21

+0

對不起 - 我不得不在jsFiddle中將'#body'更改爲body,並忘記將其改回:http://jsfiddle.net/v7JhL/2/也許這是問題所在。否則 - 警報彈出窗口中有什麼? – mrks 2013-04-07 13:23:20

+0

這是一個Shopify錯誤,上面寫着「收到我們想知道的所有信息'+ product.title」 – user2254449 2013-04-07 13:31:12

1

我想這是你想要什麼:

$('.sidebar nav ul:eq(0)').show(); 

$('.sidebar nav').click(function(){ 
    var the_ul = $(this).find("ul"); 

    if(the_ul){ 
     if (the_ul.css('display') == 'none') { 
      the_ul.slideDown('500'); 
     } else { 
      the_ul.slideUp('500'); 
     } 
    }; 
}); 

Working Demo

+0

我也這麼認爲。演示是完美的。但我試圖用你的我的.js文件替換我目前的jQuery行(上面)似乎不工作。 – user2254449 2013-04-07 13:18:21