startOffset

Das startOffset Attribut definiert einen Versatz vom Start des Pfads für die initiale aktuelle Textposition entlang des Pfades, nachdem der Pfad in das Koordinatensystem des <textPath>-Elements umgewandelt wurde.

Sie können dieses Attribut mit den folgenden SVG-Elementen verwenden:

Beispiel

html
<svg viewBox="0 0 220 100" xmlns="http://www.w3.org/2000/svg">
  <path
    id="path1"
    fill="none"
    stroke="red"
    d="M10,90 Q90,90 90,45 Q90,10 50,10 Q10,10 10,40 Q10,70 45,70 Q70,70 75,50" />
  <path
    id="path2"
    fill="none"
    stroke="red"
    d="M130,90 Q210,90 210,45 Q210,10 170,10 Q130,10 130,40 Q130,70 165,70 Q190,70 195,50" />

  <text>
    <textPath href="#path1" startOffset="0">
      Quick brown fox jumps over the lazy dog.
    </textPath>
  </text>

  <text>
    <textPath href="#path2" startOffset="40">
      Quick brown fox jumps over the lazy dog.
    </textPath>
  </text>
</svg>

Nutzungshinweise

Wert <length-percentage> | <number>
Standardwert 0
Animierbar Ja
<length-percentage>

Eine Länge stellt eine Distanz entlang des Pfads dar, gemessen im aktuellen Benutzerkoordinatensystem für das <textPath>-Element.

Wenn ein Prozentsatz angegeben wird, dann repräsentiert der Startversatz eine prozentuale Entfernung entlang des gesamten Pfades. Folglich gibt 0% den Startpunkt des Pfades und 100% den Endpunkt des Pfades an.

<number>

Dieser Wert gibt eine Entfernung entlang des Pfades an, gemessen im aktuellen Benutzerkoordinatensystem für das <textPath>-Element.

Hinweis: Negative Werte und Werte, die länger sind als die Pfadlänge (z.B. 150%), sind erlaubt.

Spezifikationen

No specification found

No specification data found for undefined.
Check for problems with this page or contribute a missing spec_url to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Browser-Kompatibilität