スクロールバーの幅は何でしょう?
重要性: 3
標準のスクロールバーの幅を返すコードを書いてください。
Windowsでは、通常 12px
と 20px
の間で変化します。もしブラウザがスクロールバーのためのスペースを予約していない場合は、0px
の可能性があります。
P.S. コードは任意のHTMLドキュメントで動作すべきで、コンテンツには依存しません。
スクロールバーの幅を取得するために、私たちはスクロールを持つがボーダーとパディングは含まない要素を作成することができます。
そして、その全幅 offsetWidth
と内部コンテンツ領域幅 clientWidth
の間の違いは、スクロールバーになります:
// スクロールを持つ div を作成します
let
div =
document.
createElement
(
'div'
)
;
div.
style.
overflowY =
'scroll'
;
div.
style.
width =
'50px'
;
div.
style.
height =
'50px'
;
// ドキュメントに置く必要があります、さもないとサイズは 0 です
document.
body.
append
(
div)
;
let
scrollWidth =
div.
offsetWidth -
div.
clientWidth;
div.
remove
(
)
;
alert
(
scrollWidth)
;