css - 将导航栏设置为默认打开

Question

我的导航栏当前默认关闭(导航栏仅在移动设备上显示)。

是否有一些 css 会默认打开导航栏？

我目前没有代码，因为我正在尝试编辑模板。我相信这是一个引导导航栏。

网站:yodega.com(在移动设备或小屏幕上)

谢谢!

Answer 1

默认不支持:

https://github.com/twbs/bootstrap/issues/3944

有一个简单快速但不干净的解决方案:

您可以在页面渲染后模拟点击导航栏元素:

document.querySelector('button.navbar-toggle').click()

链接中描述了点击方法:

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click

还有更好的解决方案，但需要更改源代码。

当您的页面呈现时，您会发现类似这样的内容:

<div class="navbar-collapse navbar-top-collapse collapse" style="height: 0px;">

你可以简单地改变它:

<div class="navbar-collapse navbar-top-collapse in" style="height: auto;">

style="height: 0px;" 可能是由您的库添加的，您应该覆盖此行为。