JS或jQuery或窗口resize或窗口宽度小于npx

如何检测用户何时调整浏览器窗口大小？

我正在寻找一个脚本，当用户调整窗口大小或窗口宽度小于900px时，它会进行somenthing。

Answer 1

嗯，你可以使用jQuery，但……

您可以订阅窗口resize事件，如下所示：

$(window).on("resize", function(event){ console.log( $(this).width() ); }); 

请注意这一点，因为当宽度小于n时执行代码的if语句在调整满足这些条件的窗口时会执行该代码的次数非常多。 最好设置一些标志或向文档添加类，并使这些部分成为您的条件。

CSS媒体查询就在哪里 ！

但是，你所问的听起来最适合用CSS Media Queries来解决。 例如，如果我们想在窗口小于900px时更改主体背景颜色：

 @media screen and (max-width: 900px) { body { background: #ccc; } } 

对于旧版本的IE，甚至还有一个很好的polyfill： https ： //github.com/scottjehl/Respond

Answer 2

jQuery的：

 $(window).resize(function() { //do something var width = $(document).width(); if (width < 900) { // do something else } }); 

Answer 3

您可以使用$(window).resize() ，如下所示

 $(window).resize(function() { if($(window).width() < 900) //do whatever you want }); 

这是$ .resize的文档

Answer 4

 $(window).resize(function() { $('body').prepend('
' + $(window).width() + '
'); // Do stuff }); 

Answer 5

根据您的需要，这可以处理窗口大小小于900px：

  $(window).on("resize", function(event){ console.log('User is using resize!'); var w = $(this).width(); if(w < 900) console.log('Your window is ' + w + 'px (less than 900px)'); });​