javascript - 响应式导航菜单调整大小？

Question

我正在尝试构建一个极其简单的响应式导航菜单。我在这里遇到了一些问题。

1. 当我将窗口的宽度调整为等于或小于 768 像素时，响应式菜单不管用。
2. 当我刷新页面时，窗口宽度等于或小于 768px，响应式导航有效......但是，如果我调整大小甚至 一个像素，响应式导航显示再次隐藏。

我在这里创建了一个 CodePen:http://codepen.io/anon/pen/fHsti

非常感谢您的帮助!

Answer 1

老实说，解决这个问题的最好方法是只使用 JS 来管理媒体查询之间的导航状态，其他所有内容都应该隐藏在媒体查询中。类似于 MediaCheck或 matchMedia是将媒体查询和 JS 结合在一起的好方法。

我created a simple demo使用您的标记，我想我得到了您正在寻找的功能。我使用 mediaCheck 清除了 768px 主断点之间的任何 JS 强加内联样式。