最近发现一个简单的jquery下拉菜单，代码很少，很适合有基础的新手学习提高。
这是jquery代码：
<script>
$(document).ready(function(){
$("ul.subnav").parent().append("<span>");
$("ul.topnav li span").click(function() {
$(this).parent().find("ul.subnav").slideDown('fast');
$(this).parent().hover(function() {
}, function(){
$(this).parent().find("ul.subnav").slideUp('slow');
});
}).hover(function() {
$(this).addClass("subhover");
}, function(){ //On Hover Out
$(this).removeClass("subhover");
});
});
</script>
下面是html代码：
<div> <ul> <li><a>首页</a></li> <li> <a>原创作品</a> <ul> <li><a>绘画艺术</a></li> <li><a>平面设计</a></li> <li><a>交互设计</a></li> <li><a>3D艺术</a></li> <li><a>摄影艺术</a></li> <li><a>其他艺术</a></li> </ul> </li> <li> <a>设计素材</a> <ul> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> </ul> </li> <li> <a>佳作欣赏</a> <ul> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> <li><a>Sub Nav Link</a></li> </ul> </li> <li><a>论坛</a></li> <li><a>网址导航</a></li> </ul> </div>
更多一个jQuery下拉菜单，代码简单，适合新手阅读。相关文章请关注PHP中文网！
