スクロールバーの幅は何でしょう?
重要性: 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);