三级下拉菜单
Posted 终身学习者
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了三级下拉菜单相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <style type="text/css"> ul li.yiji { list-style-image: url(img/-.gif); } ul li{ cursor: pointer; } </style> <body> <ul> <li class="yiji">主题市场 <ul> <li>运动派 <ul> <li>三级菜单a</li> <li>三级菜单b</li> <li>三级菜单c</li> <li>三级菜单d</li> </ul> </li> <li>有车族 <ul> <li>三级 <ul> <li>四级</li> <li>四级</li> <li>四级</li> </ul> </li> <li>三级</li> <li>三级</li> <li>三级</li> </ul> </li> <li>生活家</li> </ul> </li> <li class="yiji">特色购物 <ul> <li>淘宝二手</li> <li>拍卖会</li> <li>爱逛街</li> <li>全球购</li> <li>淘女郎</li> </ul> </li> <li class="yiji">优惠促销 <ul> <li>天天特价</li> <li>免费试用</li> <li>清仓</li> <li>1元起拍</li> </ul> </li> <li>工具</li> </ul> <div name="dd"><p>dd</p></div> <script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> //has()匹配含有选择器所匹配的元素的元素 //is()根据选择器、元素或 jQuery 对象来检测匹配元素集合 $(function(){ $("li:has(ul)").click(function(e){ if(this == e.target){ if($(this).children().is(":hidden")){ $(this).css("list-style-image","url(img/-.gif)"); }else{ $(this).css("list-style-image","url(img/1.gif)"); } $(this).children().toggle("slow"); } }) $("li:not(:has(ul))").css("list-style","none"); }) </script> </body> </html>
以上是关于三级下拉菜单的主要内容,如果未能解决你的问题,请参考以下文章