javascript - 自定义响应式下拉菜单

Question

我正在尝试将响应式导航集成到我的网站中，但在建立所需的布局时遇到了一些困难。

我在这里创建了一个 JSFiddle ；您可以调整“结果”面板的宽度，以查看导航栏折叠成响应式下拉菜单图标。实际下拉栏的功能是完美的；但是，我遇到的问题是试图使导航链接在标题未折叠到菜单中时浮动在标题旁边。因此，我不想让（未折叠的）链接列表位于标题下方，而是将它们放在它旁边，但是当脚本激活图标时下拉到下方。

CSS 是我自己的组合，其中一些来自插件开发人员的示例。我想我最终会考虑将nav#primary ul浮动留在标题（H1）上，然后display:block折叠到响应式导航栏中。

感谢您在这里提供的任何帮助。

Answer 1

试试这个→ http://jsfiddle.net/matbloom/3DUj5/

这应该可以解决问题：

nav#primary {
    float: right;
    width: 70%;
}

只需调整#primary 的宽度以配合您的演示文稿，您就应该准备就绪。