javascript - 对于 jQuery "media query"类型的情况使用 setTimeout() 是否有任何不足

标签 javascript jquery html css media-queries

我正在开发一个响应式网站。可以这么说,我正在浏览一种处理 jQuery“媒体查询”更改的方法。

我对某些元素进行了一些计算,例如高度、宽度等,当媒体查询发生变化时,例如从 1160 像素到 980 像素,我需要重新计算这些。

我找到了一个感觉不错的解决方案,因为它应该被大多数浏览器支持(如果不是全部?)但我不确定 setTimeout 是否有任何性能或任何其他问题() 像这个一样频繁地运行。

jsfiddle live example

setInterval(function() {
    //code here
}, 100);​

也许有其他更好的方法使用 paulirish 或任何其他工作人员已经制作的插件?请告诉我你在这个问题上的经验。

最佳答案

我正在使用这段代码来处理 jquery“媒体查询”。我采用了一个元素来获取我的媒体查询的大小(480、980、1160)作为选择器,在我的例子中通常是一个包装器或标题。

var myDivWidth = $('YOUR-SELECTOR').width();
$(window).resize(function () {

    if ($('YOUR-SELECTOR').width() != myDivWidth) {

        //If the media query has been triggered
                myDivWidth = $('YOUR-SELECTOR').width();

        //Your resize logic here                
         }
});

关于javascript - 对于 jQuery "media query"类型的情况使用 setTimeout() 是否有任何不足,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11557002/

相关文章:

javascript - Jquery某些单选按钮返回true

javascript - 设置 cookie 并在第一次访问时显示 div 然后隐藏

php - Jquery 切换菜单/显示和隐藏功能

javascript - 每次我点击 .approvers > a 时我都无法获取 tr id 名称

javascript - HTML5 媒体 TimeRanges 对象

html - 为什么 textarea `cols` 和输入文本 `size` 产生不同的元素宽度

javascript - 默认情况下,有人会如何将事件链接内容移动到顶部..

javascript - JQuery:将 JSON 结果存储在 JavaScript 数组中?

javascript - HTML 表单 - 表单同时验证所有内容

javascript - 获取所选文件的文件名