transform-origin

CSS Syntax

transform-origin: x-axis y-axis z-axis | initial | inherit;

JavaScript Syntax

object.style.transformOrigin="0 0"
Default value:50% 50% 0
Inherited:tidak
Animatable:ya Read about animatable
Version:CSS3

Attribute Value

default transform-origin: 50% 50% 0;

Asal transformasi berada di tengah elemen.

transform-origin: 20px 70%;

Kamu dapat menggunakan 2 nilai:

  • nilai pertama adalah sumbu horizontal
  • yang kedua adalah sumbu vertikal

transform-origin: top right;

Kamu dapat menggunakan kombinasi kata kunci posisi: center, top, bottom, left dan right.

transform-origin: center bottom;

Saat menggunakan kata kunci, kamu dapat mengubah urutan sumbu, asalkan setiap kata kunci tidak ambigu.