.resize()

类别：事件 > 浏览器事件

.resize( handler )返回类型：jQuery

描述：把一个事件处理函数绑定到“resize”JavaScript事件，或在元素上触发该事件。

此方法在第一种和第二种变体中，是.on('resize', handler)的简写，在第三种变体中，是.trigger( "resize" )的简写。

当浏览器窗口的尺寸改变时，resize事件发送到window元素。

1
2
3
 
$( window ).resize(function() {
  $( "#log" ).append( "<div>Handler for .resize() called.</div>" );
});

现在，每当浏览器窗口的尺寸改变时，消息就追加到<div id="log">后面，一次或多次，取决于浏览器。

resize中的代码不应该依赖于处理函数调用的次数。取决于实现装置，既有可能在重置大小的过程中持续发送resize事件（Internet Explorer 和基于WebKit的浏览器譬如Safari和Chrome中的典型行为），也有可能在重置大小操作结束之后发送一次resize事件（其它浏览器譬如Opera中的典型行为）。

补充说明：

  • 因为.resize()方法是.on( "resize", handler )的简写，所以可以使用.off( "resize" )来分离。

示例：

若要在调整窗口尺寸时看到窗口宽度，请尝试：

1
2
3
 
$( window ).resize(function() {
  $( "body" ).prepend( "<div>" + $( window ).width() + "</div>" );
});