在网站中,我使用菜单。如果您使用 PC 调用该页面,菜单应该是完全可见的。如果您使用手机调用该页面,则应该只显示一个按钮,单击该按钮会打开菜单。
在 PC 版本中一切正常。菜单可见,按钮隐藏。
使用手机呼叫时,该按钮可见。然而,菜单也被折叠了。
这是代码:
<button class="btn btn-default btn-block hidden-md hidden-lg hidden-xl" data-toggle="collapse" data-target="#menulist">Show more ...</button>
<div id="menulist" class="collapse in">
<div class="panel-body nav-menu-left">
<table class="table">
<tr><td><a href="1.php">Menu 1</a></td></tr>
<tr><td><a href="2.php">Menu 2</a></td></tr>
<tr><td><a href="3.php">Menu 3</a></td></tr>
</table>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
if (matchMedia) {
var mq = window.matchMedia("(max-width: 765)");
mq.addListener(WidthChange);
WidthChange(mq);
}
function WidthChange(mq) {
if (mq.matches) {
$("#menulist").removeClass("in");
}
}
});
</script>