【javascript】で画面に表示されていないスクロール分も含めた画面全体の幅・高さを取得する方法

「width: 100%」だと、画面に表示されている部分の高さや幅を取得できるだけで、スクロール分を含めた画面の高さや幅を取得できない。

スクロールした先の画面に表示されていない部分も含めた高さや幅を取得するためには、「scrollHeight」「scrollWidth」を使用することで求められる。

使い方

document.body.scrollHeight

スクロールした分も含めた高さを求めたい場合は、「document.body.scrollHeight」を使用する。

height: document.body.scrollHeight

上記コードで画面全体の高さを指定することができる。

document.body.scrollWidth

スクロールした分も含めた幅を求めたい場合は、「document.body.scrollWidth」を使用する。

height: document.body.scrollWidth

同じように、上記コードで画面全体の幅を指定することができる。

HTML5＆CSS3デザインレシピ集 [ 狩野祐東 ] 価格：3025円（税込、送料無料) (2021/7/29時点) 楽天で購入