この領域は<body>と同じサイズです。
(width: 800px, height: 600px)
クリックすると、各プロパティの数値を表示します。
ブラウザのサイズを小さくしてスクロールバーを表示させ、
下方向と右方向に少しスクロールさせてからクリックすると、
X座標、Y座標の値が変化します。
| プロパティ | 値 |
|---|---|
| 表示領域の幅 | |
| document.documentElement.clientWidth | ? |
| document.body.clientWidth | ? |
| window.innerWidth | ? |
| $(window).width() | ? |
| $(document).width() | ? |
| 表示領域の高さ | |
| document.documentElement.clientHeight | ? |
| document.body.clientHeight | ? |
| window.innerHeight | ? |
| $(window).height() | ? |
| $(document).height() | ? |
| 表示領域左上のX座標 | |
| document.documentElement.scrollLeft | ? |
| document.body.scrollLeft | ? |
| window.pageXOffset | ? |
| $(window).scrollLeft() | ? |
| $(document).scrollLeft() | ? |
| 表示領域左上のY座標 | |
| document.documentElement.scrollTop | ? |
| document.body.scrollTop | ? |
| window.pageYOffset | ? |
| $(window).scrollTop() | ? |
| $(document).scrollTop() | ? |