jQuery手风琴菜单(原创)

所属分类:导航-垂直导航,手风琴菜单

 7654  41  查看评论 (2)
jQuery手风琴菜单(原创) ie兼容7

使用很简单,引入页头样式以及jquery1.12.0的cdn,为了兼容性请使用1.12.0版本jquery.

支持2级菜单,颜色可以自行修改

相关插件-垂直导航,手风琴菜单

侧边导航收缩伸展效果

常用侧边jquery效果
  垂直导航
 25517  86

纯css京东导航

简单易懂新手容易上路
  垂直导航
 3201  8

jquery弹性竖导航网页菜单

此代码内容为jquery弹性竖导航网页菜单,属于站长常用代码,非常漂亮!
  垂直导航
 12219  45

jQuery下拉菜单插件Tendina

一个超级易用的jQuery插件,快速构建下拉菜单。
  垂直导航
 30978  45

讨论这个项目(2)回答他人问题或分享插件使用方法奖励jQ币

    透进的丶阳光 ???? 0
    2017/9/11 11:03:11
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
        <script type="text/javascript">
            $(".list_dt").on("click",function () {
    
                $('.list_dd').stop();
                // stop 方法停止当前正在运行的动画
                
                $(this).siblings("dt").removeAttr("id");
                // removeAttr 移除同胞的ID属性
    
                if($(this).attr("id")=="open"){
                    // 如果ID == open
                    $(this).removeAttr("id").siblings("dd").slideUp();
                    //移除ID  同胞dd slideUp
                }else{
                    $(this).attr("id","open").next().slideDown().siblings("dd").slideUp();
                    //否则 添加ID open 返回他的同级ID为open的下一兄弟节点,并且上拉隐藏,同级dd slideUp
                }
            });
            $(".list_dd li").click(function(){
                $(this).addClass("addclassSlideUp");
                $(this).siblings().removeClass("addclassSlideUp");
                $(this).parents("dd").siblings("dd").find("li").removeClass("addclassSlideUp");
            })
        </script>

    0分我贴代码了 加了个选中样式效果   感觉两个去除样式写的繁琐 有大神简化下吗

        0
        2017/9/15 11:04:20

        似乎可以这样:

        $(".list_dd li").click(function() {
            $(".list_dl li").removeClass("addclassSlideUp");
            $(this).addClass("addclassSlideUp");
        })
    回复
取消回复