javascript - Ember.js 中的 Foundation.js 下拉菜单

标签 javascript ember.js zurb-foundation

我正在尝试在 Ember 应用程序中使用 Foundation 框架。我遇到的问题是导航栏下拉菜单。将 Foundation 布局放置在 Handlebars 模板中时,导航栏不再适用于悬停或单击。但是,如果您缩小窗口以显示移动版本,则导航栏会在单击时起作用。我很确定这不是 Foundation 代码,因为没有 Ember 的常规 HTML 中的相同代码也能工作。

我 checkout these solutions ,但都不适合我(第一个仍在我的代码中)。

我的代码可以找到here , index.html 使用 Ember 而 grid.html 不使用 Ember。

如果您有任何见解或问题,请告诉我。

最佳答案

下拉悬停行为来自 CSS。 Ember 在这个错误中没有发挥作用。 :)

我注意到 grid.html 使用基金会网站的 CSS,而 index.html 使用本地文件的 CSS。我认为您的基础 CSS 文件版本不匹配。

我更改了 index.html 中的 CSS 链接标记,以像 grid.html 那样使用基础上的标记。这解决了问题。

<!--<link rel="stylesheet" href="css/normalize.css">-->
<!--<link rel="stylesheet" href="css/style.css">-->
<!--<link rel="stylesheet" href="css/foundation.css">-->
<link rel="stylesheet" href="http://foundation.zurb.com/page-templates4/css/normalize.css">
<link rel="stylesheet" href="http://foundation.zurb.com/page-templates4/css/foundation.css">

我建议从基础站点下载可用的 CSS,然后从那里对其进行自定义。

关于javascript - Ember.js 中的 Foundation.js 下拉菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18027979/

相关文章:

javascript - 开发现代 Web 应用程序时, "Front-end Architect"角色是否相关?

javascript - Ember 幻影模型 : For multiple hasMany and belongsTo

javascript - 如何制作加载更多按钮

javascript - 如何在右侧对齐 Kendo Tab Strip 选项卡?

ember.js - Ember 创建对象时如何观察火(观察已在模型中设置)

php - 如何将动态数据库值从一个html元素连接到另一个?

javascript - 如何在显示打开期间摆脱动画

javascript - WordPress 主题的基础 javascript

javascript - 动态页面的 Jquery Quicksearch 插件问题

unit-testing - Ember CLI : How to do Asynchronous Model Unit Testing with RESTAdapter