Wie kann ich in einem Bild an einen bestimmten Punkt ein Link einfügen, sodass wen man auf den Bereich drückt sich der Link öffnet z.B. auf Bär drückt?
1 Antwort
Wenn du es sehr genau haben möchtest, die Flagge von Berlin als SVG respektive SVG Map einbindest. Die Illustration wird dabei nicht als externe Datei eingebunden, sondern direkt mithilfe des <svg> Elements in dein HTML Dokument geschrieben.
Im SVG Code selbst nun den entsprechenden Pfad der den Bär von Berlin enthält heraussuchst und mit einem <a> Element umschließt. Über xlink:href="..." wird die Adresse des Links angeben, mit target das dieser einen neuen der Tab öffnet.
<svg>
<a xlink:href="https://berlin.de" target="_blank">
<path
/>
</a>
</svg>
Innerhalb des <path> Element stehen die entsprechenden Angaben deiner Grafik. Ich habe dir nachfolgend nochmal einen etwas ausführlicheren Artikel verlinkt, in dem du dir alle nötigen Schritte nochmal in aller Ruhe nachlesen kannst.
Woher ich das weiß:Berufserfahrung – UI/UX Designer, Full-Stack Developer