von Thomas Salvador.
Wir definieren zwei Bereiche, ein Rechteck als Link und einen Kreis ohne Linkfunktion in einer Map mit dem Namen einemap:
<map name="einemap"> <area shape="rect" coords="50,50,100,100" href="//www.brauchbar.de" alt="zur brauchbar.de Homepage" /> <area shape="circle" coords="75,75,10" nohref="nohref" alt="ich kein Link" /> </map>
Nun definieren wir ein Bild, welchem wir diese Map zuweisen. Die Annahme ist, das Definition und Aufruf in gleicher Datei geschehen.
<img src="//example.org/einbild.gif" border="0" width="150" height="150" alt="Bild mit Map" usemap="#einemap /">
<map> wird verwendet, um eine sog. client-side Image-Map zu definieren. Dies ist also eine Map, die der Besucherrechner interpretieren wird. Eine Map hat einen in name spezifierten Namen, mit dem sie identifiziert werden kann und besteht aus einer oder mehreren "heißen" Bereichen, die mit <area> spezifiziert werden.
Ist ihr Name einemap, so wird sie durch Verwendung des Parameters usemap von <img> mit dem URL-Wert
angesprochen.
Der HTML-Befehl <map> nutzt die HTML-Attribute:
| Attribut | Beschreibung |
|---|---|
| class | Space-separierte Liste von CSS-Klassen |
| dir | Ausrichtung von Text und Tabellen |
| id | Universalattribut |
| lang | Sprache des Elementes |
| name | Name der Image-Map |
| onclick | Auszuführender Javascript-Code bei Klick |
| ondblclick | Auszuführender Javascript-Code bei Doppelklick |
| onkeydown | Auszuführender Javascript-Code bei Drücken einer Taste |
| onkeypress | Auszuführender Javascript-Code bei gedrückt gehaltener Taste |
| onkeyup | Auszuführender Javascript-Code bei Loslassen einer Taste |
| onmousedown | Auszuführender Javascript-Code bei Drücken einer Maustaste |
| onmousemove | Auszuführender Javascript-Code, wenn die Maus bewegt wird |
| onmouseout | Auszuführender Javascript-Code, wenn die Maus das Element verlässt |
| onmouseover | Auszuführender Javascript-Code, wenn die Maus auf das Element bewegt wird |
| onmouseup | Auszuführender Javascript-Code bei Loslassen einer Maustaste |
| style | Inline Style |
| title | Bezeichnender Titel |
<map> wird mindestens von den HTML Browsern Avant Palm OS, Avant Windows, Chrome, Firefox, Internet Explorer, Netscape, Opera, Safari und Web TV / MSN unterstützt.
<map> wird mindestens in den Standards HTML und XHTML definiert.
Der HTML-Befehl <map> kann die HTML Tags <area> enthalten.
<map> kann in den HTML Anweisungen <a>, <abbr>, <acronym>, <address>, <applet>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, <caption>, <center>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, <fieldset>, <font>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <i>, <iframe>, <ins>, <kbd>, <label>, <legend>, <li>, <noframes>, <noscript>, <object>, <p>, <pre>, <q>, <s>, <samp>, <small>, <span>, <strike>, <strong>, <sub>, <sup>, <td>, <th>, <tt>, <u> und <var> genutzt werden.
Es spielt keine Rolle, ob die Map in der gleichen Datei, einer anderen Datei auf gleicher Domain oder sonstwo definiert wurde. usemap nimmt einen URL.
Keine.