メイン Windows Os Google Chrome のスクロールバーをカスタマイズする方法

Google Chrome のスクロールバーをカスタマイズする方法



Google Chrome には、ページのスクロールバーをカスタマイズするためのオプションがほとんどありません。スクロールバーの色、ボタン、サイズ、スクロール速度をカスタマイズできたら素晴らしいと思いませんか?そうですね、いくつかの Chrome 拡張機能でそれを行うことができます。

Google Chrome をカスタマイズする方法

Rescroller を使用した Google Chrome スクロールバーのカスタマイズ

再スクローラー おそらく Chrome スクロールバーをカスタマイズするのに最適な拡張機能です。に向かいます このページ Rescroller をブラウザに追加します。追加したら、再スクローラー 設定ツールバーの ボタンをクリックして、下のページを開きます。

テキスト メッセージを電子メール iphone に自動的に転送する

クロームスクロールバー

次に、スクロールバーの幅をカスタマイズできる [一般オプション] まで少し下にスクロールします。ドラッグできますスクロール・バー サイズスクロールバーの幅を調整するバー。これにより、Rescroller ページの右側にあるバーの幅が構成されます。

そのスライドバーのすぐ下に、ブラックリスト テキスト ボックスがあります。そこに、デフォルトのスクロールバーを維持する Web サイトの URL を入力できます。そうすれば、カスタマイズされたスクロールバーはそれらの Web サイトに含まれなくなります。

スライダー オプションまでスクロールして、スライダーの色を構成します。クリックボックスをクリックして、スライダーの代替色を選択できるパレットを開きます。そこから色を選んでクリック申し込むパレットでスライダーの色を切り替えます。

クロムスクロールバー2

または、背景画像を垂直スライダーと水平スライダーに追加します。を押します画像を選択ボタンをクリックして、スライダーの画像を選択します。次に押す開いた以下のようにスライダーに画像を追加します。

クロームスクロールバー3

スライダー オプションには、そしてボーダーズスライドバー。ボーダー バーを上にドラッグすると、スライダーにボーダーが追加されます。をドラッグしますバーを上に押して、影の効果を適用します。

ほとんどのスライダーは、デフォルトで正方形です。ただし、Chrome スライダーをカスタマイズして、より湾曲させることができます。をドラッグします角丸s スライドバーをさらに右に移動して、以下のようにスライダーにカーブしたコーナーを追加します。

クロムスクロールバー4

その下で選択できますホバリング時のスタイルをカスタマイズそしてクリック時のスタイルをカスタマイズチェックボックス。それらを選択して、以下に示すオプションを開きます。これらの設定を使用すると、カーソルを合わせたり、カーソルで選択したりしたときに、スライダーの色をさらにカスタマイズできます。

クロムスクロールバー10

背景オプションを使用すると、メインのスクロールバーをカスタマイズできますが、スライダーはカスタマイズできません。これらの設定は、スライダー オプションとほぼ同じです。そのため、メイン スクロールバーの色、影、境界線をほぼ同じようにカスタマイズできます。

Rescroller ページの少し下には、Buttons オプションがあります。まだ選択されていない場合は、スクロールボタンを表示スクロールバーにボタンを含め、それらの設定を拡張します。次に、これらのボタンの新しい色を選択するボックス。適切なボタン画像がある場合は、[X] をクリックします。アップ正しいそしてボックスを押してから画像を選択それらをスクロールバーに追加します。チェックアウト このページ スクロールバーの矢印ボタン アイコンを見つけるには、Iconfinder Web サイトで。

クロムスクロールバー5

矢印ボタンに角を丸くすることもできます。ページの一番下までスクロールし、丸い角そこのさらに右にバー。さらに、ホバリング時のスタイルをカスタマイズそしてクリック時のスタイルをカスタマイズ矢印ボタンのオプション。

最小限のスクロールバー デザインを Chrome に追加する

スクロールバーをすばやくカスタマイズするには、 最小限のスクロールバー 拡張 .これは、Google Chrome に新しいスクロールバーを追加する拡張機能で、カーソルをその上に置くと拡大し、スクロールバーが選択されていない場合は縮小または最小化します。角が丸くなった透明なスライダーもあります。

このページを開いて緑色のボタンを押して、この拡張機能を Chrome に追加します。次に、ブラウザを再起動し、いくつかのページを開いて新しいスクロールバーを試してください。ページには、すぐ下のスナップショットに表示されているスクロールバーが含まれていることがわかります。

クロムスクロールバー6

したがって、このスクロールバーは、選択されていない場合、効果的に幅が縮小されます。その上にカーソルを置くと、スクロールバーが展開されます。透明なスライダーも新しいものです。

この拡張機能には多くのカスタマイズ オプションがありませんが、デフォルトのスクロールバーが特定のページの所定の位置に留まるように構成します。を右クリックします。最小限のスクロールバーツールバーのボタンを選択し、オプション下のタブを開きます。そこで、テキスト ボックスにページの URL を入力して、カスタマイズされたスクロールバーが含まれないようにすることができます。

クロムスクロールバー7

スクロールバーのページスクロールをカスタマイズする

Rescroller または Minimal Scrollbar を使用して、スクロールバーのページ スクロール、またはスクロール速度をカスタマイズすることはできません。ただし、 クロム ホイール スムーズ スクローラー Chrome ユーザーがブラウザに追加できる拡張機能 このページ .次に、クロム ホイール スムーズ スクローラーツールバーのボタンをクリックして選択オプション下図のページを開きます。

クロムスクロールバー8

上部には、マウス ホイールのスクロールをカスタマイズできるマウス ホイール オプションがあります。たとえば、マウス ホイールを回すたびに、スライダーが特定の量だけページの下にスクロールします。をドラッグしてカスタマイズできます刻み幅さらに左または右にバー。バーを右にドラッグすると、ホイールが回転するたびにスライダーがページの下にジャンプするピクセル数が増え、スクロール速度が効果的に向上します。

そのすぐ下にある滑らかさそして滑らかさ(前部)バー。これらのバーをさらに右にドラッグすると、ホイール ロールによるページのスクロールがよりスムーズになります。左端にドラッグすると、マウス ホイールでのページ スクロールが少しぎくしゃくします。

矢印キーでページを上下にスクロールすることもできます。マウス オプションの下には、キーボード ページのスクロールをカスタマイズできる設定があります。オプションは、Chrome のキーボード スクロールバー設定をカスタマイズすることを除いて、基本的にマウスのオプションと同じです。

クロムスクロールバー9

ページの下部に、ブラック リスト テキスト ボックスがあります。そこで、選択した Chromium Wheel Smooth Scroller 設定から除外する Web サイトの URL を入力できます。

したがって、これらの拡張機能を使用すると、Google Chrome のスクロールバーをカスタマイズできます。 Rescroller でスクロールバーをオーバーホールしたり、Minimal Scrollbar で新しい透明なスライダーをブラウザーに追加したり、Chromium Wheel Smooth Scroller でページ スクロールをさらに構成したりできます。

興味深い記事

エディターズチョイス

サムスンギャラクシーJ7プロ–壁紙を変更する方法
サムスンギャラクシーJ7プロ–壁紙を変更する方法
Galaxy J7 Proをカスタマイズする方法はたくさんありますが、最も一般的な方法の1つは、デフォルトの壁紙を変更することです。このソフトウェアでは、ホーム画面とロック画面の両方の壁紙を変更できるため、次のように追加できます。
LinuxMintでロケールを追加する方法
LinuxMintでロケールを追加する方法
LinuxMintでロケールを追加する方法は次のとおりです。インストールされたロケールを使用して、ユーザーインターフェイスを変換したり、データ形式を変更したりできます。
Windows10でテキストサイズを変更する
Windows10でテキストサイズを変更する
Windows 10では、すべての高度な外観オプションが削除されました。ただし、Windows 10ビルド17692以降、設定アプリにはテキストサイズを簡単に調整できる新しいオプションがあります。
macOS:Mac用プレビューで反転選択を使用して画像を編集する
macOS:Mac用プレビューで反転選択を使用して画像を編集する
プレビュー
Google スプレッドシートで列を合計する方法 [モバイル アプリとデスクトップ]
Google スプレッドシートで列を合計する方法 [モバイル アプリとデスクトップ]
Google スプレッドシートは、間違いなく最新のビジネス スターター パックの一部です。この便利なアプリを使用すると、データを整理し、明確に、常に最新の状態に保つことができます。しかもかなり使い勝手がいい!できることはたくさんあります
GoogleChromeでユーザーエージェント文字列を変更する方法
GoogleChromeでユーザーエージェント文字列を変更する方法
私たちはPCよりも電話に多くの時間を費やす傾向があるため、今日のWebコンテンツのほとんどはモバイルユーザー向けに最適化されています。しかし、モバイルフレンドリーをいつ表示するかをブラウザがどのように知っているのか疑問に思ったことはありませんか
Windows10で電源プランを作成する方法
Windows10で電源プランを作成する方法
Windows 10でカスタム電源プランを作成することができます。デフォルトでは、Windows 10には、高性能、バランス、省電力などの電源プランが含まれています。電源プランの作成に使用できる2つの方法を次に示します。