7句js代码实现⽹页折叠菜单最近经常⽤到javascript，做了很多⽹页效果，其中有个折叠菜单。
⽹上的代码 ⼀⼤堆，⿇烦，⽽且看不懂，我就搞不懂了，写那么多代码⼲嘛~~~~ 所以⾃⼰写了个。
主要⽤到了 jquery和ul和li
定义菜单的格式是这样的：
<ul class="list">
<li>
<a class="list-title">我的信息</a><b class="icon"></b>
<ul>
<li><a href="#">个⼈资料</a></li>
<li><a href="#">收货地址</a></li>
</ul>
</li>
<li>
<a class="list-title">购物</a><b class="icon"></b>
<ul>
<li><a href="#">我的订单</a></li>
<li><a href="#">交易记录</a></li>
<li><a href="#">我的收藏</a></li>
<li><a href="#">购物车</a></li>
<li><a href="#">查看物流</a></li>
</ul>
</li>
<li>
<a class="list-title">售后服务</a><b class="icon"></b>
<ul>
<li><a href="#">订单查询</a></li>
<li><a href="#">退货申请</a></li>
<li><a href="#">投诉维权</a></li>
</ul>
</li>
<li>
<a class="list-title">购物帮助</a><b class="icon"></b>
<ul>
<li><a href="#">如何购物</a></li>
<li><a href="#">购买流程</a></li>
<li><a href="#">帮助</a></li>
</ul>
</li>
</ul>网页购物车代码
javascript代码：
$(document).ready(function(){
$(".list-title").click(function(){  //为左边的导航条注册事件折叠效果  var parent=$(this).parent();  //寻当前的⽗容器
var re=parent.css("height")!="35px"?"35px":"auto";
parent.css("height",re);
});
});
效果图：
转载请注明来源，谢谢！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。