手机上的Wordpress下拉菜单没有响应/工作

Question

希望有人能帮我解决这个问题。我终于开始使用wordpress，而不是编码一切，我被困在下拉菜单的权利。这个网站是newsby2.com，一切看起来都很棒，我在笔记本电脑上想要的是什么，菜单不是笔记本电脑上的下拉菜单，但当我去移动设备时，它看起来应该是下拉菜单，但它没有响应。单词菜单出现在红色，当我点击它，它变成白色，但什么也没有下来。我试着把内联的一些代码，但它所做的是，它只是显示了子菜单，而不需要我点击它。我想做的是当我点击单词菜单的子菜单出现。

/*--------------Mobile Menu-------------------*/
#mobile-menu {
display:none;
position:relative;
margin:0 15px;
}
#mobile-menu > span {
display:inline-block;
text-transform:uppercase;
font-family:'Rokkitt', serif;
font-size:24px;
cursor:pointer;
color:#e03d3d;
}
#mobile-menu > span:hover {
color:#fff;
}
#toggle-view-menu {
display:none;
list-style: none;
margin: 0;
padding: 0; 
border-top: none;
position:absolute;
top:33px;
left:0;
z-index:99999;
width:220px;
}
#toggle-view-menu > li {
margin: 0;
position: relative;
cursor: pointer;
list-style: none;
background-color:#e03d3d;
border-top:1px solid #fff;
}
#toggle-view-menu > li:first-child {
border-top:none;
}
#toggle-view-menu h3 {
font-size: 18px;
margin: 0;  
float: left;
line-height: 40px;  
padding: 0 15px;
}
#toggle-view-menu h3 a {
color: #fff;
width:100%;
display:block;
}
#toggle-view-menu li:hover {
background-color: #c72f2f;
}
#toggle-view-menu span {
float: right;
font-size: 26px;
width: 40px;
height: 40px;
text-align: center;
color: #fff;
line-height: 40px;
background-color:#c72f2f;
}
#toggle-view-menu li.active {
background-color:#c72f2f;
}
#toggle-view-menu li.active span,
#toggle-view-menu li.active h3 a {
color:#fff;
}
#toggle-view-menu .menu-panel {
margin: 0px;
display: none;
padding: 10px 15px 0;
font-size: 14px;
color: #fff;
background-color:#c72f2f;
border-top:1px solid #fff;
}
#toggle-view-menu .menu-panel ul {
margin:0;
}
#toggle-view-menu li .menu-panel ul li {
border:none;
list-style:disc inside;
margin: 0 0 10px 0;
color:#fff;
}
#toggle-view-menu .menu-panel ul li a {
display:inline-block;
*display:inline;
zoom:1;
color:#fff;
font-size:12px;
}
#toggle-view-menu .menu-panel ul li ul {
margin-left:40px;
margin-top:10px;
}
#main-content {
padding:25px;
background-color:#fff;
}
/* =========================================================

Answer 1

您需要添加一些jQuery来检测点击文本。

jQuery("#mobile-menu > span").click(function() {
    jQuery("#toggle-view-menu").slideToggle(500);
    return false;
});

随意编辑500来控制速度。

关于slideToggle的更多信息

Answer 2

CSS看起来不错，这似乎是一个错误在你的custom.js文件

移动菜单功能似乎工作得很好，但不是当包装

jQuery(document).ready(function () {});

您可以通过删除代码

来尝试删除文档准备函数

jQuery(document).ready(function () {" in line 163,
and "}); in line 197