onresizeイベント

onresizeイベント(リサイズイベント)とは、要素のサイズを変更した時のイベント。

構文

HTML

<element onresize="イベントハンドラ">

BODY要素

ウィンドウサイズを変更した時点にイベントハンドラを登録する場合。

<body onresize="イベントハンドラ">

JavaScript

object.onresize = function(){ イベントハンドラ };

window

ウィンドウサイズを変更した時点にイベントハンドラを登録する場合。

window.onresize = function(){ イベントハンドラ };

サンプル

サイズを変更した回数:

サンプルについて

JavaScript上で動的にイベントハンドラを登録するタイプのサンプル。

サンプルの動作について

ウィンドウサイズを変更すると、「サイズを変更した回数:」の右横に、変更した回数を表示する。

サンプルのソースコード

JavaScript

<script type="text/javascript">
window.onresize = function () {
    sample1resized();
}
var $count = 0;
function sample1resized() {
    document.getElementById( "sample1output" ).innerHTML = ++$count + "回";
}
</script>

HTML

<p>サイズを変更した回数:<span id="sample1output"></span></p>

スポンサード リンク

カテゴリー: DOM, JavaScript, その他のイベント, イベント, リファレンス パーマリンク