在媒体查询中调用/触发Foundation JS
Call/Firing Foundation JS in a Media Queries
Foundation有一些JS函数来检测媒体查询。我的问题是如何定义一些功能只是在媒体查询中发射?
确切地说,我想在medium-up上启动Foundation均衡器,或者实际上停止在移动设备上工作。
谢谢:)
@parhum,
我不确定这是否是正确的方法,但您始终可以删除data-equalizer
属性并将其添加回去。
// media query event handler
if (matchMedia) {
var mq = window.matchMedia("(min-width: 767px)");
mq.addListener(WidthChange);
WidthChange(mq);
}
// media query change
function WidthChange(mq) {
if (mq.matches) {
// window width is at least 767px
$('.row').attr('data-equalizer','data-equalizer');
}
else {
// window width is less than 767px
$('.row').removeAttr('data-equalizer');
}
}
由于某些原因,我无法使这个工作
Foundation.utils.register_media('custom', "(min-width: 767px)");
if (matchMedia(Foundation.media_queries['custom']).matches) {
// window width is at least 767px
$('.row').attr('data-equalizer', 'data-equalizer');
} else {
// window width is less than 767px
$('.row').removeAttr('data-equalizer');
}
预览:@Fiddle |代码:@Editor
~ Arvind
Foundation 6支持一个名为"equalizeOn"的均衡器属性,它允许您设置一个断点。均衡器将做它的东西到这个断点和向上(移动优先方法)。
这是文档的链接(章节,插件选项):http://foundation.zurb.com/sites/docs/equalizer.html
相关文章:
- 如何在未直接触发的情况下停止事件
- Jquery:未触发select事件
- ASP.NET通过单击JavaScript按钮触发c#事件
- Jquery隐藏未触发
- JSONP请求返回结果,但也触发error_callback
- 使用特定键在keydown时触发事件
- 未能从后端触发javascript
- 从我的控制器返回一个不同于200的代码以触发ajax错误,这被认为是一种好的做法吗
- 为什么我的点击事件没有使用 react js 触发
- node.js请求数据事件未在CORS ajax调用中触发
- 触发媒体查询断点时刷新页面
- 为什么此警报框不't被触发了?在这里追鬼
- JavaScript-动态SVG-onload属性-未触发事件
- 是否可以为HTML5输入滑块触发oninput事件
- 在IE8中不起作用的元素上触发单击事件
- 添加类来触发jquery函数
- 如何在不单击javascript中的按钮的情况下触发事件
- Zurb Foundation Reveal (Modal) 关闭后未触发的事件
- Foundation Abide-如果先前的输入无效,则在有效输入上触发无效错误
- 在媒体查询中调用/触发Foundation JS