<!DOCTYPE HTML><HTML lang="zh-CN"><head> <Meta charset="UTF-8"> <Title>Title</Title> <style> * { margin: 0; padding: 0; } .menu-items{ text-align: center; border-bottom: 1px solID #23282e; background-color: #181c20; } ul { margin: 0; padding: 0; List-style-type: none; } .right{ wIDth: 80%; height: 100%; } .left { position: fixed; background-color: #23282e; wIDth: 20%; height: 100%; } .menu-Title{ text-align: center; border-bottom: 1px solID #23282e; } .hIDe{ display: none; } .menu{ color: white; } a{ color: white; text-decoration: none; } li{ margin: 0; padding: 0; border-bottom: 1px solID #23282e; } </style></head><body><div > <div > <div >menu1</div> <div > <ul> <li><a href="https://www.baIDu.com">111</a></li> <li><a href="https://www.baIDu.com">222</a></li> <li><a href="https://www.baIDu.com">333</a></li> </ul> </div> <div >menu2</div> <div > <ul> <li><a href="https://www.baIDu.com">111</a></li> <li><a href="https://www.baIDu.com">222</a></li> <li><a href="https://www.baIDu.com">333</a></li> </ul> </div> <div >menu3</div> <div > <ul> <li><a href="https://www.baIDu.com">111</a></li> <li><a href="https://www.baIDu.com">222</a></li> <li><a href="https://www.baIDu.com">333</a></li> </ul> </div> </div></div><div ></div><script src="jquery-3.4.1.Js"></script><script> $(‘.menu-Title‘).click( function () { var $currentMenuitem = $(this).next(); $(".menu-items").not($currentMenuitem).addClass(‘hIDe‘); $(this).next().toggleClass(‘hIDe‘); } );</script></body></HTML>总结
以上是内存溢出为你收集整理的左侧标签全部内容,希望文章能够帮你解决左侧标签所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)