ロールオーバー ボタンとは?

ロールオーバー ボタンは、ユーザーのマウス ポインターの位置に応じて外観が変化する動的な Web ボタンです。通常、オーバー、ダウンの 3 つの状態があります。通常の状態はマウスがボタンから離れたときに表示され、オーバー状態はマウスがボタンの上に移動したときに適用され、ダウン状態はボタンをクリックしたときに適用されます。

タイプと用途

ロールオーバー ボタンには、さまざまな形、サイズ、色、スタイルがあります。画像はロールオーバー ボタンに変換できるため、ロールオーバー ボタンにも画像を含めることができます。ロールオーバー ボタンは、ユーザーがクリックしたときに、持ち上げたり、くぼませたり、フラットにしたり、アニメーション化したりできます。

用途

ロールオーバー ボタンは、主に Web ページ上のナビゲーション ボタンとして使用され、ユーザーを他の場所に誘導します。また、ドロップダウン メニューとポップアップ メニューでも使用されます。他のロールオーバー ボタンは、アニメーション効果とサウンドに使用されるため、ユーザーが Web 上のボタンをロールオーバーすると、画像、色、形状、テキスト、またはサウンドが変化する可能性があります。

特典

ロールオーバー ボタンは、ボタンの通常の機能を拡張します。視覚的に魅力的であるだけでなく、ロールオーバー ボタンも動的であり、ページ上のアクティブな要素であるという事実をユーザーに認識させます。 Web デザイナーは、ユーザーがこれらのボタンの上にマウスを移動すると再生される効果音を追加できます。ドロップダウン メニューまたはポップアップ メニューで使用すると、ロールオーバー ボタンはナビゲーション スペースの節約に役立ちます。

推奨サイズ

ロールオーバー ボタンのファイル サイズは小さくする必要があります。ロールオーバー ボタンは画像であるため、Web サーバーの余分なスペースをすぐに占有し、読み込み時間が長くなる可能性があります。

関連プログラム

ロールオーバー ボタンは、Adobe Photoshop、Image Ready、Flash、Fireworks などの画像編集ソフトウェアで作成できます。 Dreamweaver や Microsoft Visual Studio Developer などの Web 編集ソフトウェア プログラムを使用して、ロールオーバー ボタン効果を作成することもできます。ロールオーバー ボタンは、JavaScript または CSS を使用するか、オンラインのロールオーバー ボタン ジェネレーターを使用して Web ファイルにハードコードすることもできます。