| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 2048 人关注过本帖
标题:怎么样才能用层级选择器做出折叠菜单的效果?
只看楼主 加入收藏
zororo
Rank: 1
等 级:新手上路
帖 子:1
专家分:0
注 册:2019-9-14
结帖率:0
收藏
已结贴  问题点数:20 回复次数:1 
怎么样才能用层级选择器做出折叠菜单的效果?
<body>
    <ul class="menu-list">
      <li>
        <p class="menu-head">菜单一</p>
        <div class="menu-body">
          <a href="#">1</a>
          <a href="#">1</a>
          <a href="#">1</a>
          <a href="#">1</a>
          <a href="#">1</a>
        </div>
      </li>
      <li>
        <p class="menu-head">菜单二</p>
        <div class="menu-body">
          <a href="#">2</a>
          <a href="#">2</a>
          <a href="#">2</a>
          <a href="#">2</a>
          <a href="#">2</a>
        </div>
      </li>
      <li>
        <p class="menu-head">菜单三</p>
        <div class="menu-body">
          <a href="#">3</a>
          <a href="#">3</a>
          <a href="#">3</a>
          <a href="#">3</a>
          <a href="#">3</a>
        </div>
      </li>
      <li>
        <p class="menu-head">菜单四</p>
        <div class="menu-body">
          <a href="#">4</a>
          <a href="#">4</a>
          <a href="#">4</a>
          <a href="#">4</a>
          <a href="#">4</a>
          <a href="#">4</a>
        </div>
      </li>
    </ul>
    <script>

    $(function(){
        
        $(".menu-body").hide();
      
        $(".menu-head").click(function(){
            
                    
            })
        
        })
         
    </script>


要用到show和hide,并且点开菜单A的时候下面展开,点开菜单B的时候菜单A缩回去
搜索更多相关主题的帖子: 菜单 class 怎么样 div href 
2019-09-14 20:13
林月儿
Rank: 16Rank: 16Rank: 16Rank: 16
来 自:湖南
等 级:版主
威 望:138
帖 子:2277
专家分:10647
注 册:2015-3-19
收藏
得分:20 
程序代码:
    $(function(){        
        $(".menu-body").hide();
        $(".menu-head").click(function(){
            console.log($(this).html());
            let subItem = $(this).next();
            if(subItem.css("display")=="none"){
                subItem.show();
            }else{
                subItem.hide();
            }
        })
    })

剑栈风樯各苦辛,别时冰雪到时春
2019-09-18 18:42
快速回复:怎么样才能用层级选择器做出折叠菜单的效果?
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.040943 second(s), 8 queries.
Copyright©2004-2024, BCCN.NET, All Rights Reserved