jquery - 调整大小后导航消失

Question

我正在为该站点构建一个可折叠的导航，并注意到在它折叠后，如果您展开和缩回它并再次放大窗口，导航就会消失。我尝试将显示更改为阻止我的媒体查询，但我认为 jQuery 正在覆盖它。知道是什么原因造成的吗？

另外，我希望箭头在单击时旋转 180 度，我将如何定位它？我的jQuery如下：

/* toggle nav */
$("#menu-icon").on("click", function(){
$(".nav").slideToggle();
$(this).toggleClass("active");
});

score 0 · Accepted Answer

$(".nav").slideToggle();似乎正在离开导航display:none;状态。当您尝试display:block;在媒体查询中设置时，您使用了!important吗？

编辑

如果您的屏幕尺寸小于 570px 需要切换，那么您需要确保在任何大于 570px 的尺寸下，它将在 CSS 中设置为 display:block;

@media (min-width:571px) {
    .nav { display:block!important; }
}

这应该充分覆盖显示属性。

score 0 · Accepted Answer

在style.css，行号。1015，媒体查询用于max-width:820px

@media (max-width: 820px)

2 回答 2