Style transformOrigin özelliği

Tanım ve Kullanım

transformOrigin Bu özellik, dönüşmüş elementin konumunu değiştirmenize izin verir.

2B dönüşüm elementleri, elementin x ve y eksenlerini değiştirebilir. 3B dönüşüm elementleri, elementin z eksenini de değiştirebilir.

Yorum:Bu özellikle transform özelliği Birlikte kullanın.

Ayrıca bakınız:

JavaScript Style Objesi:transform özelliği

CSS Referans Kılavuzu:transform-origin özelliği

Örnek

Döndürme elementinin temel konumunu ayarlayın:

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

Kişisel olarak deneyin

Sözdizimi

transformOrigin özelliğini döndürün:

object.style.transformOrigin

transformOrigin özelliğini ayarlayın:

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

Özellik değeri

Değer Açıklama
x-axis

Görünümün x eksenindeki konumunu tanımlar. Olası değerler:

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

Görünümün y eksenindeki konumunu tanımlar. Olası değerler:

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

Görünümün z eksenindeki konumunu tanımlar. Olası değerler:

  • length
initial Bu özelliği öntanımlı değerine ayarlar. Bakınız initial.
inherit Bu özelliği ebeveyn elemanından bu özelliği devralır. Bakınız inherit.

Teknik ayrıntılar

Öntanımlı değer: 50% 50% 0
Dönüşüm değerleri: dizgesi, elemanın transform-origin özelliği.
CSS sürümü: CSS3

Tarayıcı desteği

Tablodaki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.

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