Beispiele aus dem Buch (Abschnitt 2.6: Geräteunabhängigkeit und Dynamik)
Dies ist ein Beispiel aus dem Buch Barrierefreies Webdesign (2004), das Ende 2004 im dpunkt.Verlag erschienen ist.
Logische Event-Handler
In JavaScript gibt es logische und geräteabhängige Event-Handler. Um bestimmte Mouseover-Effekte auch für die Tastaturbedienung verfügbar zu machen, z.B. für Links, ist es erforderlich die mausabhängigen Event-Handler onmouseover
und onmouseout
mit logischen Event-Handlern wie onfocus
und onblur
zu ergänzen.
HTML
<a href="http://www.bf-w.de/kontakt.php" onmouseover="bildWechseln(kontakt_focus);" onmouseout="bildWechseln(kontakt_n);" onfocus="bildWechseln(kontakt_focus);" onblur="bildWechseln(kontakt_n);"><img src="kontakt0.gif" width="170" height="36" alt="Kontakt" id="nav-kontakt" /><br /></a>
JavaScript
kontakt_n = new Image();
kontakt_n.src = "kontakt0.gif";
kontakt_focus = new Image();
kontakt_focus.src = "kontakt1.gif";
function bildWechseln(bildname) {
document.getElementById ('nav-kontakt').src = bildname.src;
}