自动检测Web浏览器窗口宽度变化？

Question

我知道你用$(window).width()可以获得web浏览器的大小.

我想检测用户何时更改其Web浏览器的大小,以便我可以重新调整列宽.有没有办法自动检测这个或我是否必须使用setTimeinterval循环,看看它是否已更改？

Answer 1

尝试调整大小事件

$(window).resize(function() {
  console.log('window was resized');
});

Answer 2

JavaScript事件已命名window.onresize.

JQuery绑定已命名 .resize()

Answer 3

写下这个原因导致这些答案都没有给出现代最佳实践方法:

window.addEventListener("resize", function(event) {
    console.log(document.body.clientWidth + ' wide by ' + document.body.clientHeight+' high');
})

Answer 4

您可能想使用debounce： https: //davidwalsh.name/javascript-debounce-function

否则

window.addEventListener("resize")

在窗口大小调整过程中将一直触发。这会加重你的 CPU 开销。

Answer 5

在MDN中,他们提供了一个非常好的Javascript独立代码:

window.onresize = resize;

function resize()
{
 alert("resize event detected!");
}

如果您只需要这种功能,我建议您继续使用.