问题标签 [hamburger-menu]

我说的是出现在某些屏幕宽度下方的按钮，该按钮在单击时隐藏/取消隐藏菜单（下面的屏幕截图）。我试图在我的网站上复制它的行为而不使用引导程序（因为我喜欢在没有框架的情况下工作）。

我查看了源代码，但无法弄清楚它是如何工作的，以及最有效的方法是复制行为。据我所知，它通过向菜单应用隐藏/取消隐藏类（由按钮激活）与 javascript 一起工作。

是否可以使用 css 复选框 hack 来复制它？还是使用 javascript 更好？

Famous 实现这些众所周知的移动应用程序设计模式的最佳方式是什么？

！）“汉堡包”和像这个jasny示例这样的侧面菜单？

2）Table-View，过渡到全屏详情页，有点像： http: //goratchet.com/examples/app-movies/

谢谢！

我需要一些有关引导导航的帮助。我希望它通过移动设备上的汉堡包图标进行切换。

这是在codepen上：http ://codepen.io/sadman/pen/hfGwv （链接无效）

我正在使用引导程序在一个带有drupal的网站上工作。我在桌面版本上有不同的菜单：顶栏菜单、主导航、子导航。他们在不同的位置。

在移动设备上，我想在 1 个带有可折叠链接的汉堡菜单中显示所有这些菜单。最好的方法是什么？

我可以在页面上创建两次所有菜单，然后根据视口显示/隐藏菜单......还是有更好的方法？

以下是 plunker 链接：http ://plnkr.co/edit/peQEGK4mNiPBqlknrO6V?p=preview

当页面加载汉堡菜单应该关闭，当我们点击图标时，它应该单独打开并滚动。

我不想使用 hamburger.js 。没有那个如何实现这个功能。

代码 ：

css有什么问题。

我们试图确定我们应用程序的主要导航结构。我已经阅读了有关汉堡菜单（又名侧菜单，抽屉）的缺点的所有内容。

使用可见的导航栏（而不是汉堡菜单）是有意义的，它可以适应我们的设计，因为我们没有太多的屏幕可以导航。

对于 iOS 用户，我们发现了一些导航栏的示例，例如 Whatsapp 中的这个：

这是 iOS 中很常见的模式，iOS 用户似乎对它很熟悉。

但是对于 android 就不能这么说了。我找不到使用这种主图标导航栏的单个应用程序。

有人可以提供一个使用它的“顶级”应用程序的例子吗？

像这样构建它会不会是错误的，在为 android 开发时它不是一个不推荐使用的模式吗？

我目前有两个汉堡包，试图展示第三个。提供了一个 jsfiddle，由于某种原因无法复制以获得第三条白线。

https://jsfiddle.net/p5f8hekw/

有任何想法吗？

谢谢

我只使用从 codrops 网站获得的 CSS3 代码在我的网站标题中插入了一个“汉堡”菜单图标。该图标使用伪类 :before 和 :after 并且在最新版本的 Chrome 和 IE11 中完美运行。但是，使用 IE9（我们的组织在工作中使用），初始触发图标甚至无法正确显示，并且在加载页面时只有 3 行（我认为是中间行）中的一个可见。我以前使用这些伪类的 IE9 没有任何问题。我检查了我的 html 中没有任何内容使 IE9 恢复为怪癖模式，并且可以确认此问题发生在 IE9 标准模式下。我还检查了 codrops 网站http://tympanus.net/Tutorials/AnimatedBorderMenus/index2.html上的原始演示并发生同样的问题。我也在工作场所之外使用过 IE9，同样的事情发生了，只有一行“汉堡包”是可见的。

用于图标的 CSS 如下（我知道任何 CSS3 动画都不能在 IE9 中工作，但这不应该阻止初始触发器图标正确显示吗？）；

网页中使用的 HTML 标记是：

任何有关如何在 IE9 中正确显示汉堡包的帮助将不胜感激！

我正在使用 Ionic Framework 开发一个应用程序，其中主视图是地图（使用 Leaflet）。在侧面菜单中，有一些表格可以允许在地图上进行不同的搜索（2 点之间的最短路径......）。

问题是，每次我单击表单的其中一个输入（文本、复选框...）时，侧边菜单都会关闭。

有没有办法避免这种情况？当我点击“burguer”按钮时，侧边菜单是否可能仅关闭并显示？

我已经开始开发一个汉堡模块，基本上由两部分组成：

• 一个打开菜单的“burger-opener”按钮，很可能是一个属性指令，包括一个单击事件侦听器、dom 和 css 不可知论
• 一个“汉堡菜单”元素，很可能是一个受益于嵌入的指令，让客户端为了可重用性而决定菜单包含的内容。这基本上在它的顶部提供了一个关闭按钮，在 ng-transclude 元素之前。

就功能而言，这两个元素之间必须存在紧密的关系，即按钮元素将调用“打开”到汉堡菜单元素中。

问题是，我有一个约束，即按钮和菜单不必相互包含。例如，必须能够像这样使用模块

这个约束似乎是自动排除指令到使用“require”语法的指令通信，因为这个 angularjs 功能假设指令是自包含的。所以除非我创建一个包含我的 2 个元素的顶级 DOM 控制器......我被卡住了。

我一直在使用蛮力方法，即使用来自 rootscope 的广播按钮将“打开”消息发送到菜单指令。它就像一个魅力，但我对它不满意。

另一种方法是在按钮上设置一个偶数，但出于某种奇怪的原因，我会将其视为失败。我可能错了，但我很确定有一种更优雅的方法可以使用 AngularJS 范例连接这两个元素，而不使用广播或事件。

你知道吗 ？我想基本上我在问诸如 ui bootstrap modal service 之类的组件实际上是如何工作的。