如何使Superfish菜單在第一級垂直但在第二級水平？

我在Drupal7中使用Superfish菜單，我的第一個項目級別是垂直設計的。現在我想讓我的第二個項目級別水平。我怎麼能這樣做？我嘗試了不同的CSS方法，通過jQuery添加了一些類名，如如何使Superfish菜單在第一級垂直但在第二級水平？

$（'first-level li'）find（'ul'）。addClass（'sf-vertical'）;

但沒有什麼幫助。 TNX！

編輯：here is a jsfiddle和我的菜單看起來像

<ul id="superfish-1" class="sf-menu menu-page-menu sf-vertical sf-style-none sf-total-items-6 sf-parent-items-1 sf-single-items-5 sf-js-enabled"> 
    <li id="menu-622-1" class="first odd sf-item-1 sf-depth-1 sf-no-children">Item 1</li> 
    <li id="menu-623-1" class="middle even sf-item-2 sf-depth-1 sf-total-children-5 sf-parent-children-0 sf-single-children-5 menuparent">Item 2 
     <ul class="sf-vertical sf-hidden"> 
      <li id="menu-633-1" class="first odd sf-item-1 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li> 
      <li id="menu-634-1" class="middle even sf-item-2 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li> 
      <li id="menu-635-1" class="middle odd sf-item-3 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li> 
      <li id="menu-636-1" class="middle even sf-item-4 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li> 
      <li id="menu-637-1" class="last odd sf-item-5 sf-depth-2 sf-no-children" style="white-space: normal; float: left; width: 100%; ">SubItem </li> 
     </ul> 
    </li> 
    <li id="menu-624-1" class="middle odd sf-item-3 sf-depth-1 sf-no-children">Item 3</li> 
    <li id="menu-625-1" class="middle even sf-item-4 sf-depth-1 sf-no-children">Item 4</li> 
    <li id="menu-626-1" class="middle odd sf-item-5 sf-depth-1 sf-no-children">Item 5</li> 
    <li id="menu-627-1" class="last even sf-item-6 sf-depth-1 sf-no-children">Item 6</li> 
</ul>

來源

2013-04-04 headkit

嘗試把你的代碼中jsfiddle或類似的或這可能會被關閉。 – zik 2013-04-04 15:16:59

是啊，我在... – headkit 2013-04-04 15:17:31

@Kiz增加了jsFiddle和一些代碼。 – headkit 2013-04-04 16:53:38

給出.sf-menu ul li ul修復寬度和.sf-menu ul ul li刪除width:100%並給予margin_right:XXpx;

CSS像

.sf-menu ul li ul{width:400px;} 
.sf-menu ul ul li{float:left; margin-right:10px;}

來源

2013-04-05 06:18:59

thanx爲您提供幫助。不幸的是它不起作用。你在jsfiddle裏面試過嗎？ – headkit 2013-04-05 07:54:27

我從頭開始建立了另一個菜單，我發現你的width-hint做了訣竅。所以我將這個答案標記爲正確。日Thnx！這裏是我的JSBin：http://jsbin.com/egowof/2/edit – headkit 2013-05-29 08:07:13

如何使Superfish菜單在第一級垂直但在第二級水平？

回答

相關問題