jQuery课程管理侧边菜单代码.zip资源-CSDN文库

共33个文件

png：30个

html：1个

js：1个

版权申诉

jQuery特效

CSS特效

网页特效

40 浏览量 2023-10-14 23:59:43 上传评论收藏 48KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

jQuery课程管理侧边菜单代码.zip （33个子文件）

jiaoben7082

jquery.min.js 91KB

css

style.css 5KB

index.html 3KB

images

nav-pic3.png 509B

nuv_04.png 572B

nuv_04_hover.png 559B

nav-pic8-h.png 293B

nav-pic4-h.png 254B

nav-pic6-h.png 195B

nav-pic6.png 195B

nav-pic1.png 240B

lvc-arrow-bottom.png 238B

nav-pic5-h.png 207B

nuv_03_hover.png 566B

nav-pic3-h.png 509B

nav-pic10.png 431B

nav-pic8.png 293B

nav-pic7-h.png 167B

nav-pic4.png 254B

nav-pic12-h.png 417B

nav-pic1-h.png 240B

nav-pic11.png 253B

nav-pic2-h.png 196B

nav-pic9.png 385B

nav-pic2.png 196B

nav-pic9-h.png 385B

nav-pic11-h.png 253B

nav-pic12.png 417B

nav-pic10-h.png 431B

lvc-arrow-right.png 236B

nuv_03.png 560B

nav-pic5.png 207B

nav-pic7.png 167B

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery课程管理侧边菜单代码 - 【更多源码：www.96flw.com】</title> <link href="css/style.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="js/jquery.min.js"></script> </head> <body> <div class="lvc-wrap" id="lvc-nav"> <ul class="lvc-nav"> <li class="nav-pic1 next-layer" title="课堂管理"> <a>课堂管理</a> <ol> <li>历史课堂统计</li> <li>课堂实时统计</li> </ol> </li> <li class="nav-pic2" title="科目管理"><a>科目管理</a></li> <li class="nav-pic3" title="教室管理"><a>教室管理</a></li> <li class="nav-pic4" title="课堂点播"><a>课堂点播</a></li> <li class="nav-pic5" title="课堂直播"><a>课堂直播</a></li> <li class="nav-pic6" title="用户管理"><a>用户管理</a></li> <li class="nav-pic7 next-layer" title="报表统计"> <a>报表统计</a> <ol> <li>历史课堂统计</li> <li>课堂实时统计</li> </ol> </li> <li class="nav-pic8" title="日志管理"><a>日志管理</a></li> <li class="nav-pic9" title="系统管理"><a>系统管理</a></li> <li class="nav-pic10" title="订单管理"><a>订单管理</a></li> <li class="nav-pic11" title="我的课堂"><a>我的课堂</a></li> <li class="nav-pic12" title="个人中心"><a>个人中心</a></li> </ul> <button type="button" class="btn-nav"></button> </div> <script type="text/javascript"> $(document).ready(function(){ //展开收起 $(".btn-nav").click(function () { $(".lvc-wrap").toggleClass("lvc-close") $("ol").toggleClass("small-ol") $(".next-layer ol").hide() if($("#lvc-nav").hasClass('lvc-close')){ $(".next-layer ").removeClass("arrow") } }) //选中状态 $(".lvc-nav li").click(function () { $(this).siblings().find('ol').hide() $(this).addClass("active").siblings().removeClass("active") }) //选中子集清除父级active $("ol>li").click(function (e) { console.log('ol>li clicked') e.stopPropagation() $(this).parent().parent().removeClass("active") }) //二级导航展开收起 $(".next-layer").click(function () { $(this).children("ol").toggle(); $(this).toggleClass("arrow").siblings().removeClass("arrow") }) $("ol li").click(function () { if($("ol").hasClass('small-ol')) { $(".small-ol").hide(); $(this).parent().parent().addClass("active") } }) }) </script> <div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持Safari、IE8及以下浏览器。</p> <p>更多源码：<a href="http://www.96flw.com/" target="_blank">www.96flw.com</a></p> </div> </body> </html>

评论收藏

内容反馈

版权申诉