こんにちは！森です。

遅い梅雨明けの後、暑い日が続きますが、体調などは崩されてませんか？？

今回はJavaScriptのちょっとしたときに使えるスクリプトを紹介します。

ブラウザウィンドウの幅や、高さを取得したいことってあるかと思います。
例えば、JavaScriptを使って、画像を固定位置に置きたい時や、固定位置にメッセージを表示したい時などです。

HTMLのDOCTYPE宣言の有無によって、関数が変わってきます。

───────────────────────────
DOCTYPE宣言無し（互換モード）の場合

document.body.clientWidth
document.body.clientHeight

で取得することが出来ます。
───────────────────────────
DOCTYPE宣言有り（標準モード）の場合

document.documentElement.clientWidth
document.documentElement.clientHeight

で取得することが出来ます。
───────────────────────────
下のボタンを押すと、ブラウザの幅と高さを取得します。



ブラウザの幅や高さを変えて、もう一度押してみると、変えた値になっているはず、、です。

このようにして、ブラウザの幅や高さを取得することで、画面右下の座標を取得することが出来ます。
右下に画像を常に表示したい場合など、onscroll時に、CSSのtopやleftプロパティをJavaScriptで変更することで対応できます。

何かの参考になれば幸いです。

※サンプルソースは全ブラウザで動作するとは限りません。