Question

我想在此页面中使用jquery创建一个切换菜单：http://propertymanagementoh.com/new-short-header-page/。右上方有一个菜单。当有人点击＆＃34;菜单☰＆＃34;我想让它切换。按钮然后菜单将出现，再次点击按钮然后将消失（如下所示：http://www.titleonemanagement.com/）。我编写了以下代码，但它无法正常工作：

<script>
   $(document).ready(function(){
     $("#block-37").click(function(){
      $("#block-38 .menu").toggle();
    }); 
   }); 
</script>

还使用了以下css：

#block-38 .menu{
   position:fixed;
   top:0;
   right:0;
   width:250px;
   overflow:hidden;
   z-index:999999;
 }

Answer 1

使用了两个jquery脚本，这意味着jQuery.noConflict（true）导致第二组jquery指令出现问题。

建议用户组合脚本并且它有效！

：）

根据评论提供的其他帮助：需要做一些事情来帮助解决这个问题。 1）在你的CSS中添加：

#block38 .nav-vertical.active {
   rgba(0,0,0,.5);
   position:fixed;
   top:0;
   left:0;
   z-index:999;
   width:100%;
   height:100%;
}
#whitewrap.notactive {
    margin-left:-235px;
}

2）从

更改你的jquery

$("#block-37").click(function(){
    $("#block-38 .menu").toggle();
});

到：

$("#block-37").click(function(){
    $("#block-38 .menu").toggle();
    $("#block38 .nav-vertical").toggleClass("active");
    $("#whitewrap").toggleClass("notactive");
});

菜单打开后，您需要添加另一个按钮，以便用户可以关闭它。做十字架：制作一个图像或div，并给它类“closeNav”。

然后改变你的jquery：

$("#block-37, .closeNav").click(function(){
    $("#block-38 .menu").toggle();
    $("#block38 .nav-vertical").toggleClass("active");
    $("#whitewrap").toggleClass("notactive");
});

切换菜单，Jquery无法正常工作

1 个答案: