Question

这是我的website。它有一个顶级菜单和侧边栏菜单。页面加载时，边栏默认可见。在桌面上没有问题，但是当在移动设备上查看时，侧栏位于网站内容之上，并且无法将其删除，因为显示/隐藏它的切换按钮位于顶部菜单中。

页面加载时是否可以默认隐藏？（问题1）

此外，如果它工作，那么show / hide侧边栏在桌面上工作正常，但是如果我们最小化浏览器窗口，它就会变成相反的，就像隐藏它时一样，显示HIDE SIDEBAR，当它显示时，SHOW显示SIDEBAR。

我用来隐藏/显示侧栏的jquery代码是：

 var f=1; // to displayd HIDE, since by default its shown.
 $(document).ready(function(){
    $("#menu-toggle").click(function(){
    if (f==0)
        {
            $("#menu-toggle").html("<b>Show Categories</b>");
            f=1;
        }
    else
        {
            $("#menu-toggle").html("<b>Hide Categories</b>");
            f=0;
        }
    });
});

是否可以知道我是在移动设备还是桌面设备上，以便我可以相应地初始化f的值？（问题2）

Answer 1

在$(document).ready上的trigger click活动中再添加一行，如下所示：

page load

对于你的第二个问题，如果你的话，你会得到很多$(document).ready(function(){ //Event code start here .... //Event code end here $("#menu-toggle").trigger('click') //trigger its click });解决方案搜索，例如 here 和 another here

Answer 2

使用切换比点击更方便，如果你想在页面加载时隐藏它，首先在html中设置display none（简单方式）

$(document).ready(function(){
 $("#menu-toggle").toggle(function(){
     if($(this).css('display') === 'none')
    {
        $("#menu-toggle").html("<b>Hide Categories</b>"); //this is hide
    }
 else
    {
        $("#menu-toggle").html("<b>Show Categories</b>"); //this is show
    }
 });
 });

如何在引导程序中加载页面时隐藏侧边栏？

2 个答案: