Latest web development tutorials

HTML DOM 스타일 transformOrigin 속성

스타일 객체 참조 스타일 개체

예

세트 포인트 위치 회전 요소 :

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

»시도

정의 및 사용

속성을 transformOrigin하면 요소의 위치를 ​​변환 할 수 변경할 수 있습니다.

원소 X 및 Y 축선을 변화시킬 수있는 2D 변환 소자. 3D 변환 소자는 Z 요소를 변경할 수있다.

참고 :이 속성은해야 변환 특성과 사용.

브라우저 지원

Internet ExplorerFirefoxOperaGoogle ChromeSafari

인터넷 익스플로러 10, 파이어 폭스와 오페라 지원 transformOrigin 속성입니다.

인터넷 익스플로러 9는 재산의 또 다른 속성을 지원하는 (전용 2D 변환을위한) msTransformOrigin 속성.

크롬, 사파리와 오페라 (3D 및 2D 변환에 사용 가능) 속성을 WebkitTransformOrigin property 속성의 또 다른 대안을 지원합니다.

문법

위로 transformOrigin 속성 :

object .style.transformOrigin

transformOrigin 속성 설정 :

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

속성 값

值 描述
x-axis 定义视图被置于 X 轴的何处。可能的值：
  • left
  • center
  • right
  • length
  • %
y-axis 定义视图被置于 Y 轴的何处。可能的值：
  • top
  • center
  • bottom
  • length
  • %
z-axis 定义视图被置于 Z 轴的何处（用于 3D 转换）。可能的值：
  • length
initial 设置该属性为它的默认值。请参阅 initial 。
inherit 从父元素继承该属性。请参阅 inherit 。

기술 세부 사항

기본값 : 50 % 50 % 0
반환 값 : 변환 출처를 속성 요소를 나타내는 문자열입니다.
CSS 버전 CSS3

관련 기사

자바 스크립트 스타일 객체 : 속성을 변환

CSS 참조 설명서 : 변형 특성 - 원산지

스타일 객체 참조 스타일 개체