扫码关注官方订阅号
我就是想实现点击当前图标出来菜单,但是其他的菜单隐藏(未实现),再次点击图标当前菜单隐藏(已实现)
下面我这么写没用。。
认证0级讲师
按照你需要的功能写了个简单的例子
HTML
<ul class="menu"> <li> 1 <p>我是 菜单1 的子菜单</p> </li> <li> 2 <p>我是 菜单2 的子菜单</p> </li> <li> 3 <p>我是 菜单3 的子菜单</p> </li> </ul>
CSS
.menu{width: 300px;margin: 100px auto;cursor: pointer;} .menu li{font-size: 25px;width: 50px;height: 50px;line-height: 50px;text-align: center;border: 1px solid;position: relative} .menu li p{width: 200px;height: 50px;border: 1px solid; font-size: 14px;position: absolute;left: 51px;top: -1px;display: none}
JS
var li = $('.menu li'); li.click(function(){ var n = li.index($(this)); $('.menu li:not(:eq('+n+'))').find('p').hide(); $(this).find('p').toggle(); });
var _thisP=$(this).parents(".parent").find("菜单class"); $("菜单class").not(_thisP).hide(); _thisP.toggle();
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
按照你需要的功能写了个简单的例子
HTML
CSS
JS