Bildbereiche verlinken mit Image Maps

Aus twinewiki-de.net

Image Maps ermöglichen es, Bereiche eines Bildes anklickbar zu machen. Im folgenden Beispiel wird man beim Anklicken der Gesichtspartieren zu unterschiedlichen Abschnitten weitergeleitet.

Hinweise:

  • Das Bild "mona-lisa.jpg" muss im selben Ordner liegen wie das fertige Spiel (siehe auch: Bilder einfügen).
  • Die unter coords angegebenen Koordinaten definieren die linke obere und rechte untere Ecke eines rechteckigen Bildausschnitts (jeweils X- und Y-Wert in Pixeln). Zum Ermitteln der gewünschten Koordinaten können alle gängigen Apps zur Bildbearbeitung verwendet werden.
  • Damit die festgelegten Koordinaten funktionieren, darf die Bildgröße nachträglich nicht mehr verändert werden, z. B. mit dem Attribut width.
<img src="mona-lisa.jpg" usemap="#mona-lisa">
<map name="mona-lisa">
[<area shape="rect" coords="39,97,208,202">]<augen|
[<area shape="rect" coords="1063,131,1258,249">]<nase|
[<area shape="rect" coords="760,345,935,466">]<mund|
(click: ?augen)[(goto: "Augen")]
(click: ?nase)[(goto: "Nase")]
(click: ?mund)[(goto: "Mund")]
</map>

Siehe auch: (click:), (goto:)

Versionshinweis: Twine 2.6.0 | Harlowe 3.3.4