如果我把一級菜單和二級菜單分開寫那應該怎么實現本案例特效
<div class="shopClass ">
? <h3>全部商品分類<i class="shopClass_icon"></i></h3>
? <div class="shopClass_show ">
? ? ?<dl class="shopClass_item">
? ? ? ? <dt><a href="#" class="b">品牌商家</a> <a href="#" class="b">元祖</a> <a href="#" class="aLink">麥當勞</a></dt>
? ? ? ? <dd><a href="#">至尊披薩</a> <a href="#">85°C</a> <a href="#">一盒糖</a></dd>
? ? ?</dl>
<div>
<div class="shopClass_list ">
? ? ?<dl class="shopList_item">
? ? ? ? <dt>電腦裝機</dt>
? ? ? ? <dd>
? ? ? ? ? ?<a href="#">文字啊</a><a href="#">文字字啊</a><a href="#">文字字字啊</a><a href="#">文字啊</a><a href="#">文字</a><a href="#">文字啊</a>
? ? ? ? </dd>
? ? ?</dl>
<div>
好像上面一樣。我把一級菜單和二級菜單分開寫的話，要怎么實現這個懸浮層的特效？
2016-04-05
不好意思，之前那個有錯。
window.onload=function ?() {
var x=document.getElementsByClassName("aLink"),
p=document.getElementsByClassName("shopList_item");
var timer=null;
x[0].onmouseover=p[0].onmouseover=function(){
p[0].style.display="block";
clearTimeout(timer);
};
x[0].onmouseout=p[0].onmouseout=function(){
timer=setTimeout(function(){
p[0].style.display="none";
},300);
}
};
2016-04-05
嗯，你已經取出了shopClass和shopClass_List的內容，那么例如第一個商家品牌，當鼠標移入到商標品牌的時候，讓它顯示二級菜單內容，移出隱藏，當鼠標移入二級菜單內容時，也做顯示二級菜單內容，移出二級菜單時，再做移出事件，隱藏二級菜單 ，但是當移出時，設置一下延遲時間，等一下再隱藏
2016-04-03
用CSS樣式把二級菜單移動到你要想顯示的位置，其余的還是用JS控制它的顯示和隱藏就好了