こんちには。
職人見習いの木村です。

最近では、WebサイトのFLASH離れが進み、HTMLでのフルスクリーンサイトも増えつつあります。

フルスクリーンサイトにおいて、必要になってくるのがウィンドウのリサイズイベントです。
今回は、jQueryでリサイズイベントを使ってみます。

jQueryでのリサイズイベントは以下のようにして、実装できます。

$(要素).resize(fn);

▽サンプルコード
▼JS

$(function(){

 resizeHandler();
 $(window).resize(function(){
  resizeHandler();
 });
});

function resizeHandler(){
 var h = $(window).height()-30  $("#container").height(h);
}

▼HTML

上記のサンプルを動かすと、ブラウザの長さが変わると同時に、赤いボックスの長さも変わってきます。

※この記事は、なかの人(moresmileman)が書いています。