如何在页面加载引导程序时隐藏侧边栏？-Java 学习之路

这是我的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）

2 回答

1
在 $(document).ready 上将 $(document).ready 中的另一行添加到 trigger click 事件中，如下所示：
```
$(document).ready(function(){
    //Event code start here
       ....
    //Event code end here
    $("#menu-toggle").trigger('click') //trigger its click
});
```
对于你的第二个问题，如果你搜索，你会得到很多javascript解决方案，就像这里和其他人一样
回复于 2024-04-20T00:35:25+08:00

使用切换比点击更方便，如果你想在页面加载时隐藏它，首先在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
    }
 });
 });

回复于 2024-04-20T00:35:25+08:00

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

2 回答

相关问题