JavaScript:レイヤーを画面サイズにフィットさせる

goto_jp 455views 更新:2014年7月14日

例えば下記関数「onloadFunction」の場合、「fitLayer」というIDを持つレイヤーをウィンドウと同サイズにさせます。

function onloadFunction() {
    if(document.getElementById("fitLayer") != null) {
        var w = document.documentElement.clientWidth;
        var h = document.documentElement.clientHeight;
        document.getElementById("fitLayer").style.width = w + "px";
        document.getElementById("fitLayer").style.height = h + "px";
    }
}

上記ではウィンドウサイズぴったりになりますが、特定サイズにフィットさせる場合は3、4行目で計算をするだけで済みます。

HTML側では下記のようにonloadで呼び出します。

<body onload="onloadFunction()">

 

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません