Anker

Ein Anker ist ein Link zu einer Überschrift auf derselben oder einer anderen Seite. Bei Klick auf das Anker-Symbol wird der Link automatisch in die Zwischenablage kopiert.

Varianten

Anker

Vorschau

Aktuelle Meldungen

Code

<wm-anchor id="meineid">
  <h3>Aktuelle Meldungen</h3>
</wm-anchor>

Dev

Weitere Beispiele

Anker mit manuell gesetzer ID

Achtung: keine Doppelung der IDs

Vorschau

Aktuelle Meldungen

Code

<wm-anchor id="idaufankermanuell">
  <h3>Aktuelle Meldungen</h3>
</wm-anchor>
<wm-anchor id="idaufankermanuell1">
  <h3>Aktuelle Meldungen</h3>
</wm-anchor>

Anker auf Überschrift mit manuell gesetzter ID

Achtung: keine Doppelung der IDs

Vorschau

Aktuelle Meldungen

Code

<wm-anchor>
  <h3 id="customid">Aktuelle Meldungen</h3>
</wm-anchor>
<wm-anchor>
  <h3 id="customid1">Aktuelle Meldungen</h3>
</wm-anchor>

Anker mit mehreren gleichen Überschriften

Automatische Generierung der IDs

Vorschau

Weitere Informationen

Code

<wm-anchor>
  <h3>Weitere Informationen</h3>
</wm-anchor>
<wm-anchor>
  <h3>Weitere Informationen</h3>
</wm-anchor>

Anker mit anderem Icon auf Überschrift

Vorschau

Weitere Informationen

Code

<wm-anchor icon="embed">
  <h3>Weitere Informationen</h3>
</wm-anchor>

API

wm-anchor

Eigenschaften

Eigenschaften
Eigenschaft	Beschreibung	Werte	Default
`copyText`	Setzt den lokalisierten Text für den Kopier-Link-Button.	`String`
`successText`	Setzt den lokalisierten Text für die Kopier-Erfolgsmeldung.	`String`
`icon`	Icon für den "Link kopieren"-Link	`String`	`"link"`
`id`	Die ID kann entweder auf dem Element selber oder der Überschrift vergeben werden.	`String`	leer

Slots

Name	Beschreibung
`default`	h2, h3, h4, h5, oder h6

Kontakt

Haben Sie noch Fragen, Feedback oder brauchen Sie ein Element, das die Pattern Library noch nicht bietet?

handbuch@ma53.wien.gv.at