2011-05-12 88 views
1

我有一個導航,有一個下拉菜單。現在這些下拉菜單項左右有邊框,但在下拉項的最後一項上,我不想擁有邊框權限。從jQuery菜單中刪除邊框

HTML

<ul id="mainNav"> 
<li> 
    <a href="#">Link1</a> 
    <ul class="dropDown" style="dislay:none;"> 
    <li><a href="link.html">SubLinkA</a></li> 
    <li><a href="link.html">SubLinkB</a></li> 
    </ul> 
</li> 
<li> 
    <a href="#">Link2</a> 
    <ul class="dropDown" style="dislay:none;"> 
    <li><a href="link.html">SubLinkC</a></li> 
    <li><a href="link.html">SubLinkD</a></li> 
    </ul> 
</li> 
<li> 
    <a href="#">Link3</a> 
    <ul class="dropDown" style="dislay:none;"> 
    <li><a href="link.html">SubLinkE</a></li> 
    <li><a href="link.html">SubLinkF</a></li> 
    </ul> 
</li> 
</ul> 

CSS

.dropDown li { 
border: 1px solid black; 
} 

現在,當使用鼠標懸停例如鏈接3它顯示的下拉菜單。在下拉菜單中,現在雙方都有邊界,但我想要有邊界 - 右邊:0;在具有SubLinkF鏈接的li項目上。以前的下拉列表項目也是如此。如果我把這個jQuery放入$('。dropDown li:last')。css(border-right:0);它只是失去了邊界,從最後李項:(

感謝您的幫助!

回答

1

更改您的代碼

$('.dropDown:last li').css(border-right:0); 

你不希望最後的鋰元素,你希望所有的利-elements在過去的UL-元素

0

你應該添加一個類的最後UL像 「最後」,然後在你的CSS:。

.last > li { border-right: 0 }

我堅信你應該刪除在CSS而不是JavaScript的邊框。