分享一个常用的商城左侧弹出层菜单,你可以自定义菜单选项名称和链接。
HTML
一级导航和对应的二级导航HTML代码
<div class="item">
<div class="product">
<h3><a href="http://www.sucaihuo.com/">名片</a></h3>
<s></s>
</div>
<div class="product-wrap pos02">
<div class="cf">
<div class="fl wd252 pr20">
<h2><a href="http://www.sucaihuo.com/">名片</a></h2>
<p class="lh30">免费在线设计,印刷低至3.8元/盒,全国包邮。</p>
<ul class="cf">
<li><a href="http://www.sucaihuo.com/" target="_blank">名片设计</a></li>
<li><a href="http://www.sucaihuo.com/" target="_blank">名片印刷</a></li>
<li><a href="http://www.sucaihuo.com/" target="_blank">名片模板</a></li>
<li><a href="http://www.sucaihuo.com/" target="_blank">名片欣赏</a></li>
<li><a href="http://www.sucaihuo.com/" target="_blank">名片常识</a></li>
</ul>
</div>
<dl class="fl wd185 pl20 blee">
<dt class="lh36">促销活动</dt>
<dd><a href="http://www.sucaihuo.com/" target="_blank" title="logo"><img src="images/0931224551.jpg"></a></dd>
</dl>
</div>
</div>
</div>
鼠标悬浮和离开菜单触发事件
$('.all-goods .item').hover(function() {
$(this).addClass('active').find('s').hide();
$(this).find('.product-wrap').show();
}, function() {
$(this).removeClass('active').find('s').show();
$(this).find('.product-wrap').hide();
});
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791