Chromeでスクロールバーを非表示にする方法を紹介!

Chromeでスクロールバーを非表示にする方法を紹介!

ブラウザ・Google Chromeではスクロールバーが表示されていますが、スクリーンショット時に邪魔だと感じたり、スクロールバーを使わない人には不要ですよね。この記事では、Google Chromeのスクロールバーを非表示にする方法をご紹介しています。


目次[非表示]

  1. Chromeでスクロールバーを非表示にしたい
  2. Chromeでスクロールバーを非表示にする方法

Chromeでスクロールバーを非表示にしたい

ブラウザ・Google Chromeを使っていて、スクロールバーが邪魔だと感じたことはありませんか?Chromeのスクロールバーは設定でオフにできないので、スクロールバーが大きいと思ったり、そもそもスクロールはマウスホイールやキーボードで行うから不要・スクリーンショット時にスクロールバーが写るのが嫌…など、様々な意見があると思います。

そこで、この記事ではChromeのスクロールバーを非表示にする方法を説明していきます。

Chromeでスクロールバーを非表示にする方法

それでは、Google Chromeでスクロールバーを非表示にする方法を説明します。スクロールバーを非表示にするには、アドオン「Rescroller」を導入しましょう。下記リンク先のchromeウェブストアへアクセスします。

RESCROLLER - CHROME ウェブストア
chromeウェブストアのRescrollerページで「Chromeに追加」ボタンをクリック
chromeウェブストアのRescrollerページが表示されるので、ページ右上に表示されている「Chromeに追加」ボタンをクリックしましょう。
「拡張機能を追加」ボタンをクリックしてインストール
アドレスバーの下に「Rescrollerを追加しますか?」ウィンドウが表示されるので、「拡張機能を追加」ボタンをクリックしましょう。Rescrollerがインストールされます。
オプション設定タブで「Miscellaneous」の「Use Custom CSS(Advanced Users Only)」のチェックボックスをオンにする
インストール完了と同時にオプション設定タブが表示されるので、一番下までスクロールして「Miscellaneous」の「Use Custom CSS(Advanced Users Only)」のチェックボックスをオンにしましょう。
「::-webkit-scrollbar {」の下の行に「display:none;」と入力
CSS入力項目が表示されるので、一番上の設定項目である「::-webkit-scrollbar {」の下の行に「display:none;」と入力しましょう。
スクロールバーの非表示画面

設定完了後にWebページを表示すると、このようにスクロールバーが非表示になっていることが確認できます。これでスクロールバーを消すことができました。


関連記事