Ein Hover-Effekt ist die Veränderung eines Elements, während der Mauszeiger darüber steht. Auf Geräten ohne Maus gibt es diesen Zustand nicht.
- Hover-Effekt
Veränderung der Darstellung eines Elements, während der Mauszeiger darüber steht.
Beispiel: „Ein Hover-Effekt zeigt, dass ein Element bedienbar ist.“
Wofür er da ist
Als Rückmeldung: Hier lässt sich klicken. Links, Knöpfe und Kacheln bekommen deshalb einen, meist eine Änderung von Farbe, Rahmen oder Schatten. Ein sanfter Übergang über transition lässt das ruhiger wirken.
Auf Touchgeräten gibt es ihn nicht
Ein Finger schwebt nicht. Manche Browser lösen den Zustand beim Antippen aus und lassen ihn danach stehen, was zu Elementen führt, die hervorgehoben bleiben. Deshalb darf nie eine Information ausschließlich im Hover stecken: Ein Menü, das sich nur so öffnet, ist auf dem Telefon unerreichbar.
@media (hover: hover) {
.karte:hover { border-color: #0078ff; }
}