ホーム » マウス軌跡

マウス軌跡

マウス軌跡

パソコンでマウスを動かしたときに、光の線が後ろに残る演出を付けます。

こんなときに使います

たとえば:イベント用ページで、マウスの動きに軽い演出を付けたい。

マウスに追従する線を表示します。本文を読む邪魔にならないか、動きを苦手とする人にも配慮して判断します。

操作する画面の開き方

WordPress管理画面の「OptiB」を開き、管理パネルの「テーマ設定」→「マウス軌跡」へ進みます。

実画面で確認

画面を見ながら操作しましょう

マウス軌跡の実際の設定画面
マウス軌跡の設定欄。画像を押すと拡大できます。表示中の値は撮影時の例です。
  1. 「マウス軌跡エフェクトを有効化」が機能のスイッチです。
  2. OSの視覚効果の設定を無視する項目は、通常はオフのままにします。
  3. 「パラメータ調整」で線の太さや明るさを少しずつ調整します。

設定する手順

  1. OptiBのテーマ設定から「マウス軌跡」を開きます。
  2. 「マウス軌跡エフェクトを有効化」をオンにして保存します。
  3. 公開ページでマウスを動かし、線の見え方を確認します。
  4. 必要なら下の項目を1つずつ調整して保存します。

調整項目の意味

  • 減衰率:大きいほど線が長く残ります。
  • 線の太さ:大きいほど太い線になります。
  • 明るさ:大きいほど光が強くなります。
  • カットオフ:薄い残像を消すための境目の値です。
  • 軌跡の色:光の色です。#ffffffは白を表します。

表示されないとき

タッチ操作だけのスマホやタブレットでは表示されません。ブラウザの描画機能に対応していない場合や、端末で「視覚効果を減らす」が有効な場合にも止まります。マウスを3秒以上止めたときや、別のタブを見ている間も一時停止します。

文字が読みにくいほど明るくせず、閲覧する人の「視覚効果を減らす」設定を尊重して使いましょう。

ここまでできたら完了

  • マウスを使うパソコンで、公開ページに軌跡が表示される
  • 演出が本文の読みやすさやボタン操作を妨げていない

次に読むマニュアル