宝哥软件园

jQuery实现的无限级下拉菜单功能示例

编辑:宝哥软件园 来源:互联网 时间:2021-09-07

本文实例讲述了jQuery实现的无限级下拉菜单功能。分享给大家供大家参考,具体如下:

!doctype html html lang=' en ' hearta charset=' UTF-8 '标题下拉菜单(无限级)/title style * { padd : 0;保证金: 0;}李{列表式-类型:无;}车身{ margin: 50px}。隐藏{ display:无}。菜单cursor:指针;}/style/head dyul Li class=' menu ' style=' float : left;跨度一级菜单/span ul class=' hide ' Li class=' menu ' span二级菜单/span ul class=' hide ' Li class=' menu ' span三级菜单/span ul class=' hide ' Li class=' menu ' span四级菜单/span ul class=' hide ' Li class=' menu ' span五级菜单/span/Li/ul/Li/ul/Li/ul/Li/ul/Li Li class=' menu ' style=' float : left;'跨度一级菜单/span ul class=' hide ' Li class=' menu ' span二级菜单/span ul class=' hide ' Li class=' menu ' span三级菜单/span ul class=' hide ' Li class=' menu ' span四级菜单/span ul class=' hide ' Li class=' menu ' span五级菜单/span/Li/ul/Li/ul/Li/ul/Li/ul/Li/ulscript src=' http : jquery-1。7 .2 .量滴js '/script script $(function(){ var menu=$(').菜单');menu.hover(function(){ $(this)).儿童(' ul ').show();},function(){ $(this).儿童(' ul ').hide();});});/脚本/正文/html运行效果图如下:

更多关于jQuery相关内容感兴趣的读者可查看本站专题: 《jQuery切换特效与技巧总结》 、 《jQuery扩展技巧总结》 、 《jQuery常用插件及用法总结》 、 《jQuery拖拽特效与技巧总结》 、 《jQuery表格(table)操作技巧汇总》 、 《jquery中Ajax用法总结》 、 《jQuery常见经典特效汇总》 、 《jQuery动画与特效用法总结》 及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

更多资讯
游戏推荐
更多+