3.11.1.4 Abbildungen zu einer Image Map erweitern
| [unmarkierte Version] | [unmarkierte Version] |
Keine Bearbeitungszusammenfassung |
|||
| Zeile 31: | Zeile 31: | ||
'''Code:''' | '''Code:''' | ||
<code><imagemap> | |||
Image:Metabild.png|300px|Titel | |||
default [[LOOP-Tutorial|Gehe zur Hauptseite]] | |||
</imagemap></code> | |||
'''Ergebnis:''' | |||
<imagemap> | <imagemap> | ||
Image:Metabild.png|300px|Titel | Image:Metabild.png|300px|Titel | ||
default [[LOOP-Tutorial|Gehe zur Hauptseite]] | default [[LOOP-Tutorial|Gehe zur Hauptseite]] | ||
</imagemap> | </imagemap> | ||
====Komplexe Variante der ImageMap==== | ====Komplexe Variante der ImageMap==== | ||
Version vom 3. Februar 2016, 10:50 Uhr
Eine Grafik kann mit ImageMap nun auch mit einem Link gesetzt werden. Entweder in der einfachen Variante, sprich das gesamte Bild dient als Verknüpfungspunkt, oder in der filigraneren Variante mit einzelnen Bildbereichen.
Gesamtbildverlinkung auf interne Seite[]
Möchten Sie ein Bild mit einer LOOP-Seite verlinken, nutzen Sie den unteren Beispielcode. Mit dem Attribut Quickinfo ist der aufblinkende Text gemeint, der erscheint sobald man mit dem Mauszeiger über das Bild fährt.
Code:
[[Datei:Metabild.png|300px|Quickinfo|link=LOOP-Tutorial]]
Ergebnis:
Gesamtbildverlinkung auf externe Seite[]
Möchten Sie ein Bild mit einer externen Internetseite verlinken, setzen Sie den Link mit http/https-Präfix. In unteren Beispiel wird Sie das Bild auf die Seite von Google führen.
Code:
[[Datei:Metabild.png|300px|Quickinfo|link=https://www.google.de]]
Ergebnis:
Bildverlinkung mit einer angepasster ImageMap[]
Einfache Variante der ImageMap[]
Bei der einfachen Nutzung einer ImageMap fungiert das gesamte Bild als Verlinkungsnetz.
Code:
<imagemap>
Image:Metabild.png|300px|Titel
default [[LOOP-Tutorial|Gehe zur Hauptseite]]
</imagemap>
Ergebnis: <imagemap> Image:Metabild.png|300px|Titel default Gehe zur Hauptseite </imagemap>
Komplexe Variante der ImageMap[]
Komplexe Variante = ImageMap für definierten Bereich der Verlinkung im Bild:
<imagemap> Image:Metabild.png|300px|Titel default Gehe zur Hauptseite </imagemap>
Online Image Map Editor: http://www.maschek.hu/imagemap/imgmap
Wiki auf deutsch: http://wikis.zum.de/zum/Hilfe:ImageMap
Wiki auf englisch: https://www.mediawiki.org/wiki/Extension:ImageMap
Es handelt sich hierbei um das Tutorial für LOOP1. Die Dokumentation für LOOP 2 wird gegenwärtig entwickelt: https://loop.eduloop.de. Viele Funktionen lassen sich ähnlich auch in LOOP2 verwenden.