分享一个手机wap常用的展开伸缩菜单效果,菜单导航代码很简单,你可以改成自己想要的样式。
垂直导航菜单HTML代码:
<ul class="clearfix">
<li>
<a class="cur" href="javascript:void(0)">精选水果</a>
<ul style="display:block;">
<li><a href="http://www.sucaihuo.com/">进口水果</a></li>
<li><a href="http://www.sucaihuo.com/">国产水果</a></li>
<li><a href="http://www.sucaihuo.com/">水果色拉</a></li>
<li><a href="http://www.sucaihuo.com/">水果礼盒</a></li>
</ul>
</li>
<li>
<a href="javascript:void(0)">田园时蔬</a>
<ul>
<li><a href="http://www.sucaihuo.com/">进口水果</a></li>
<li><a href="http://www.sucaihuo.com/">国产水果</a></li>
<li><a href="http://www.sucaihuo.com/">水果色拉</a></li>
<li><a href="http://www.sucaihuo.com/">水果礼盒</a></li>
</ul>
</li>
</ul>
点击菜单js代码
$(".ny_zblb1 ul li").click(function() {
var thisSpan = $(this);
$(".ny_zblb1 ul li ul").prev("a").removeClass("cur");
$("ul", this).prev("a").addClass("cur");
$(this).children("ul").slideDown("fast");
$(this).siblings().children("ul").slideUp("fast");
})
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791