我在我的项目中使用 css 媒体查询来创建一个适用于任何尺寸屏幕的网站。我希望触发不同的 jquery 函数,就像使用 css 一样。
例如,如果浏览器尺寸在1000px到1300px之间,我想调用以下函数:
$('#mycarousel').jcarousel({
vertical: true,
scroll: 1,
auto: 2,
wrap: 'circular'
});
但是当浏览器尺寸低于1000px时,js将停止处理。等等等等。
我不确定这是否可行,但也许有一个现有的解决方案或插件可以根据浏览器窗口大小创建不同的 js 环境。我想我可以以某种格式创建条件语句。有什么想法吗?
The 现代化 http://modernizr.com库支持直接调用 JavaScript 来评估媒体查询。
如果您不想这样做,您可以让不同的 CSS 规则驱动隐藏元素的某些属性,然后您可以使用“.css()”来检查 jQuery 的值。换句话说,“大于1000px宽”的规则可以设置一个隐藏的<div>
到“宽度:1000px”,然后你可以检查
if ( $("#widthIndicator").css("width") === "1000px") {
// whatever
Here http://jsfiddle.net/9X4up/是一个愚蠢的jsfiddle演示。左右拖动中间的分隔栏可以看到 JavaScript 代码(在间隔计时器中)检测到隐藏元素的有效“宽度”的更改。
如果您引用响应式设计,那么您还可以触发现有元素的属性,而无需向 html 添加标记,例如
if ( $("#navigation li").css("float") === "none") {
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)