jQuery API の resize( fn ) は、リサイズイベントにイベントハンドラをバインドしたいときに便利なメソッドだ。
ブラウザのウィンドウのサイズを変更するたびに、resize( fn ) の引数に指定したイベントハンドラを呼び出すことができる。
記述方法
jQuery( セレクター ) . resize( イベンドハンドラ );
「セレクター」の要素のリサイズイベントに、「イベンドハンドラ」をバインド。
実装例(サンプル)
リサイズ回数:0
実装例(サンプル)の動作について
ブラウザのウィンドウのサイズを変更するたびに、「リサイズ回数:」の右側の数字が増えていく。
実装例(サンプル)のソースコード
JavaScript
<script>
<!--
var count = 0;
jQuery( window ) . resize( function() {
jQuery( '#jquery-api-resize' ). text( ++count );
} );
// -->
</script>
<!--
var count = 0;
jQuery( window ) . resize( function() {
jQuery( '#jquery-api-resize' ). text( ++count );
} );
// -->
</script>
HTML
<p>リサイズ回数:<span id="jquery-api-resize">0</span></p>