Hover

コンピューティングにおいて、ホバーとは、クリックせずに、カーソルをリンク、ボタン、アイコンなどのインタラクティブな要素の上に移動させることを指します。たとえば、Webページ上のリンクにカーソルを合わせると、カーソルが矢印から手の形に変わったり、クリックできることを示すためにリンクの色が変わったりすることがあります。

Web開発者は、HTML、CSS、またはJavaScriptを使ってホバー効果を追加できます。

• HTMLには、リンクやボタンに追加できるグローバルイベント属性onmouseoverがあります。

  <button onmouseover="myFunction()";>Hover over me</button>

• CSSには、ポインターが要素の上に置かれているときにその要素をどのように表示するか（たとえば、色を変えたり、テキストに下線を付けたり）を定義する疑似クラス:hoverがあります。
  

  a:hover { color:darkblue; text-decoration: underline; }

• JavaScriptには、"EventListener"メソッドを使って関数やその他のコードを実行できるmouseoverイベントとmouseoutイベントがあります。
  

  myElement.addEventListener("mouseover", function() { ... }

ホバーの概念はWebサイト以外にも広がっています。多くのオペレーティングシステムやデスクトップアプリケーションでは、カーソルをアイコン、ボタン、またはメニューの上に合わせると、それらが強調表示されます。要素の上に1～2秒間カーソルを合わせると、ツールチップを表示するものもあります。ホバーによるフィードバックは、ポインティングしてからクリックするまでの間に追加情報を提供することで、ユーザーインターフェースをより直感的にします。

ホバーとタッチスクリーン

ホバーにはカーソルが必要なため、通常は、操作の大部分をタップやジェスチャーで行うタッチスクリーンには当てはまりません。モバイルデバイスでは、同様のフィードバックを提供するために、デザイナーは長押しや視覚的な手がかりなどの代替手段をよく使います。