Firefoxでスクロールバーが自動的に消えてしまい、使いづらいと感じていませんか。
Windows 11やMacでは、デフォルトで一定時間操作しないとスクロールバーが非表示になる「オーバーレイスクロールバー」が採用されています。
この記事では、Firefoxでスクロールバーを常に表示する方法を、OS別に詳しく解説します。
Firefoxの設定で常に表示にする方法
Firefox 116以降では、ブラウザの設定から簡単にスクロールバーを常に表示できます。
- Firefoxのメニューボタン(右上の三本線アイコン)をクリック
- 「設定」を選択
- 左側のメニューから「一般」を選択
- 「ブラウジング」セクションまでスクロール
- 「スクロールバーを常に表示する」にチェックを入れる
この設定を有効にすると、スクロールが必要なページでスクロールバーが常に表示されるようになります。
Windows 11でシステム設定から変更する方法
Windows 11を使用している場合、OS側の設定でFirefoxを含むすべてのアプリケーションのスクロールバー表示を制御できます。
Firefoxはこのシステム設定に従うように設計されています。
- Windowsの「設定」を開く(スタートボタン→歯車アイコン)
- 「アクセシビリティ」を選択
- 「視覚効果」をクリック
- 「スクロールバーを常に表示する」をオンにする
この設定を有効にすると、Firefox以外のアプリケーションでもスクロールバーが常に表示されるようになります。
Windows 10でスクロールバーを表示する方法
Windows 10では、設定の場所が少し異なります。
- Windowsの「設定」を開く
- 「簡単操作」を選択
- 左側のメニューから「ディスプレイ」を選択
- 「Windowsをシンプルにしてカスタマイズする」セクション内にある「Windowsのスクロールバーを自動的に隠す」をオフにする
about:configで詳細設定を行う方法
Firefoxの高度な設定ページ「about:config」を使用すると、スクロールバーの表示やスタイルをより細かく制御できます。
スクロールバーを常に表示する設定
- アドレスバーに「about:config」と入力してEnterキーを押す
- 警告メッセージが表示されたら「危険性を承知の上で使用する」をクリック
- 検索ボックスに設定名を入力して値を変更
Windows 11のオーバーレイスクロールバーを無効化
設定名: widget.non-native-theme.win11.scrollbar.force-overlay-style
値: false(デフォルトはtrue)
この設定をfalseにすると、Windows 11のオーバーレイスクロールバーが無効になり、従来型のスクロールバーが表示されます。
スクロールバーを常に表示
設定名: layout.testing.overlay-scrollbars.always-visible
値: true
この設定をtrueにすると、スクロールバーが常に表示されるようになります。
スクロールバーの太さを変更する方法
スクロールバーが細すぎて操作しづらい場合、太さを変更できます。
- about:configページで以下の設定を検索
- 設定名:
widget.non-native-theme.scrollbar.size.override - 鉛筆アイコンをクリックして編集
- デフォルトの
0を任意の数値(10、15、20など)に変更 - チェックマークをクリックして保存
数値を大きくするほどスクロールバーが太くなります。
変更はブラウザを再起動せずに即座に反映されます。
スクロールバーのスタイルを変更する方法
Firefoxでは、異なるOS風のスクロールバースタイルを選択できます。
設定名: widget.non-native-theme.scrollbar.style
以下の値を設定できます:
0: デフォルト(OSに応じた自動選択)1: Mac OS X風2: GTK風(Linux)3: Android風4: Windows 10風5: Windows 11風
例えば、Windows 11で従来のWindows 10風のスクロールバーを使いたい場合は、値を4に設定します。
Linuxでスクロールバーを設定する方法
Linuxでは、Firefoxの設定に加えて、GTK設定ファイルを編集する必要がある場合があります。
Firefox設定
- Firefoxの「設定」→「一般」→「ブラウジング」
- 「スクロールバーを常に表示する」にチェック
GTK設定ファイルの編集
スクロールバーのボタン(上下矢印)を表示したい場合は、以下の手順を実行します。
~/.config/gtk-3.0/gtk.cssファイルを作成または編集- 以下の内容を追加:
scrollbar {
-GtkScrollbar-has-backward-stepper: true;
-GtkScrollbar-has-forward-stepper: true;
}- ファイルを保存してFirefoxを再起動
about:configでの追加設定(Linux)
設定名: widget.non-native-theme.gtk.scrollbar.allow-buttons
値: true
この設定を有効にすると、スクロールバーの上下ボタンが表示されます。
設定名: widget.gtk.overlay-scrollbars.enabled
値: false
この設定をfalseにすると、オーバーレイスクロールバーが無効になります。
Macでスクロールバーを常に表示する方法
MacOSでは、システム設定から変更します。
- 「システム設定」(または「システム環境設定」)を開く
- 「アクセシビリティ」を選択
- 「ディスプレイ」をクリック
- 「スクロールバーを常に表示」をオンにする
この設定は、Firefox以外のすべてのアプリケーションにも適用されます。
スクロールバーが表示されない場合のトラブルシューティング
設定が反映されない場合
- Firefoxを完全に終了して再起動
- システム設定を変更した場合は、OSの再起動を試す
- 拡張機能が原因の可能性があるため、すべての拡張機能を一時的に無効化して確認
スクロールバーは表示されるが矢印ボタンがない場合
about:configで以下の設定を確認:
widget.non-native-theme.gtk.scrollbar.allow-buttons(Linux)widget.non-native-theme.scrollbar.styleの値を4に変更(Windows 10風スクロールバーには矢印ボタンがある)
Webサイト側の設定で非表示になっている場合
一部のWebサイトでは、CSS設定によりスクロールバーを非表示にしている場合があります。
この場合、ブラウザ側の設定では表示できません。
開発者向け:CSSでスクロールバーを常に表示する方法
Web開発者がWebサイト上でスクロールバーを常に表示したい場合、CSSを使用します。
html {
overflow-y: scroll;
}このコードをCSSに追加すると、縦方向のスクロールバーが常に表示されます。
注意点として、-webkit-scrollbarによるスクロールバーのカスタマイズはWebkit系ブラウザ(Chrome、Edge、Safari)でのみ機能し、Firefoxでは適用されません。
まとめ
Firefoxでスクロールバーを常に表示する方法は、使用しているOSやバージョンによって異なります。
最も簡単な方法:
- Firefox 116以降:設定→一般→ブラウジング→「スクロールバーを常に表示する」
- Windows 11:システム設定→アクセシビリティ→視覚効果→「スクロールバーを常に表示する」
より詳細なカスタマイズ:
- about:configを使用してスクロールバーの太さやスタイルを変更
- Linuxの場合はGTK設定ファイルの編集も検討
スクロールバーが常に表示されることで、ページの長さを把握しやすくなり、より快適にブラウジングできます。
コメント