在 jQuery 中使用 resize() 函数

简介

resize() 函数是 jQuery 提供的专门用于处理浏览器窗口大小变化事件的方法。它会在浏览器窗口大小发生变化时触发。可以使用该函数指定一个函数来在浏览器窗口大小变化时执行相应的操作。

语法

$(window).resize(function(){
  // 在窗口发生大小变化时执行的代码
});

示例

// 指定函数在窗口发生大小变化时执行
$(window).resize(function(){
  // 获取窗口的宽度和高度
  var w = $(window).width();
  var h = $(window).height();
  
  // 在控制台输出窗口宽度和高度
  console.log('Window width: ' + w + ', Window height: ' + h);
});

注意事项

• resize() 函数只能用于指定窗口对象，如 $(window)，不能用于 DOM 元素对象。
• 当浏览器窗口大小变化时，resize() 函数可能被频繁调用，因此要注意节制浏览器的开销。
• 在某些浏览器中，比如 IE6，resize() 函数不能正常工作，需要使用 IE 专用的事件 onresize。
• 在某些情况下，窗口大小变化事件可能不会被及时触发，需要使用 setTimeout() 函数或者其他的技术来处理该问题。