[jQuery] not selector使用
因為最近在協助設計改一些效果有用到
需求是希望在
滑鼠移動到ul.funlist中的項目時
上一層的<a>不要被加上變色的class
所以主要是要排除li#except-li
故利用
var navLi=$("ul.page_nav- li:not(#except-li)");
排除li#except-li
變色的js如下
需求是希望在
<ul class="page_nav-">
<li>
<a href="/C28_sofachair.html">客廳沙發座椅</a>
<div class="pagemega" style="display: none;">
<ul>
<li><a href="/S35_sofa.html">皮沙發</a></li>
<li><a href="/S36_sofa.html">布沙發</a></li>
<li><a href="/S37_sofa.html">L型沙發/沙發組</a></li>
</ul>
</div>
</li>
<li id="except-li">
<a href="/C31_bedroom.html">臥室床組</a>
<div class="">
<ul class="funlist">
<li><a href="/S54_zzzz.html" class="pagemega-seleted">單人床組/架</a></li>
<li><a href="/S55_xxxxx.html" class="">雙人床組/架</a></li>
<li><a href="/S56_ccccc.html" class="">加大床組/架</a></li>
<li><a href="/S60_bbbb.html" class="">床頭片/床頭箱</a></li>
</ul>
</div>
</li>
</ul>
滑鼠移動到ul.funlist中的項目時
上一層的<a>不要被加上變色的class
所以主要是要排除li#except-li
故利用
var navLi=$("ul.page_nav- li:not(#except-li)");
排除li#except-li
變色的js如下
$(document).ready(function(){
var navLi=$("ul.page_nav- li:not(#except-li)");
$('.pagemega').hide();
navLi.mouseover(function () {
$(this).find("a:first").addClass("current");
$(this).find(".pagemega").stop().show();
});
navLi.mouseleave(function(){
$(this).find("a:first").removeClass("current");
$(this).find(".pagemega").stop().hide();
});
});
留言
張貼留言