Eigenschaft Style transformOrigin

Definition und Verwendung

transformOrigin Eigenschaft ermöglicht es Ihnen, den Standort des transformierten Elements zu ändern.

2D-Transformationselemente können die x- und y-Achsen des Elements ändern. 3D-Transformationselemente können auch die z-Achse des Elements ändern.

Kommentare:Diese Eigenschaft muss mit Eigenschaft transform Zusammen verwenden.

Siehe auch:

JavaScript Style-Objekt:Eigenschaft transform

CSS-Referenzhandbuch:Eigenschaft transform-origin

Beispiel

Setzen Sie die Grundposition des rotierenden Elements:

document.getElementById("myDIV").style.transformOrigin = "0 0";

Probieren Sie es selbst aus

Syntax

Rückgabe der Eigenschaft transformOrigin:

object.style.transformOrigin

Setzen Sie die Eigenschaft transformOrigin:

object.style.transformOrigin = "x-axis y-axis z-axis|initial|inherit"

Eigenschaftswert

Wert Beschreibung
x-axis

Definiert den Positionierungsstandort der Ansicht auf der x-Achse. Mögliche Werte:

  • left
  • center
  • right
  • length
  • %
y-axis

Definiert den Positionierungsstandort der Ansicht auf der y-Achse. Mögliche Werte:

  • top
  • center
  • bottom
  • length
  • %
z-axis

Definiert den Positionierungsstandort der Ansicht auf der z-Achse. Mögliche Werte:

  • length
initial Setzen Sie diesen Wert auf seinen Standardwert. Siehe initial.
inherit Erben Sie diese Eigenschaft von ihrem übergeordneten Element. Siehe inherit.

Technische Details

Standardwert: 50% 50% 0
Rückgabewert: Zeichenkette, die den Eigenschaft transform-origin.
CSS-Version: CSS3

Browser-Unterstützung

Die Zahlen in der Tabelle weisen auf die erste vollständige Unterstützung der Eigenschaft durch einen Browser hin.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
36.0 10.0 16.0 9.0 23.0