jQuery三级下拉列表导航菜单代码共享

本文展示了jQuery三级下拉列表的导航菜单。分享给大家参考。具体如下：jQuery三级下拉列表的导航菜单基于jquery-1.8.3.min.js，可以无限分类，可以智能判断是否有下级菜单。鼠标通过最后一个菜单显示下级菜单。操作效果图：检查效果。

提示：如果浏览器工作不正常，可以尝试切换浏览模式。大家分享的jQuery三级下拉列表导航菜单代码如下

hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8' /titlejQuery三级下拉列表导航菜单/title脚本类型=' text/JavaScript ' src=' http : js/jquery-1。8 .3 .量滴js '/脚本样式类型=' text/CSS ' * { margin : 0；padd : 0；} body { font-size : 12px}李{列表式：无；} ul。nav Li {宽度： 200像素；文本对齐：居中；}ul.nav li{左侧浮动：右边距：10 px} ul.nav li h3 { height: 40px线高： 40px} ul。nav Li H3 {背景： # 72 a7 ff} ul。nav Li ul Li H3 {背景： # ffd 9d 9；}ul.nav li h3:hover，选择{ background: #ffc0c0！重要；} ul Li ul { display : none } ul Li . on ul { display : block } ul . nav Li {相对位置：} ul。Li ul Li ul {绝对位置：top : 0；右：-200像素；} ul。导航范围。sub {位置：绝对；显示器：块；right :10 xtop : 0；宽度： 10px高度： 40px背景：网址(图像/箭头. png)无重复中心；}/style脚本类型=' text/JavaScript ' $(文档)。ready(function() { $('ul.nav li ').悬停(function(){ $(this)).添加CLaSS(' on ')；}，function(){ $(this).移除CLaSS(' on ')；}) });$(文档)。ready(function() { $('ul.nav li ').悬停(function(){ $(this)).父代(' ul ').兄弟姐妹(' h3 ').addCLaSS(' choice ')；}，function(){ $(this).父代(' ul ').兄弟姐妹(' h3 ').移除CLaSS(' choice ')；}) });$(文档)。ready(function(){ if($(' ul。李导航' .查找(' ul ').html()！='') { $('ul.nav li ').父代(' ul ').兄弟姐妹(' h3 ').追加(' span class=' sub '/span ')；} });/script/head dyul class=' nav ' lih 3我的网站/h3 ul lih32级分类/h3 ul lih33级分类/h3 ul lih34级分类/h3 ul lih35级分类/H3/李莉35级分类/H3/李莉35级分类/H3/李莉35级分类/H3/李/ul/李莉34级分类/H3/李莉34级分类/H3/李莉34级分类/H3/李/ul/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李/ul/李莉3我的网站/h3 ul lih32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/李李33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/Li Li 33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李/ul/李莉3我的网站/h3 ul lih32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李/ul/李莉3我的网站/h3 ul lih32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李/ul/李莉32级分类/h3 ul lih33级分类/H3/李莉33级分类/H3/李莉33级分类/H3/李莉33级分类/Li/ul/Li/ul/Li/ul/ul/body/html以上就是为大家分享的jQuery三级下拉列表导航菜单代码，希望大家可以喜欢。