예
회전 된 요소의 기본 위치를 설정합니다 :
document.getElementById("myDIV").style.transformOrigin = "0 0";
»그것을 자신을 시도 정의 및 사용
transformOrigin 속성을 사용하면 변형 요소의 위치를 변경할 수 있습니다.
2D 변환 소자는 소자의 X 축과 Y 축으로 변경할 수있다. 3D 변환 소자는 소자의 z 축 변경할 수있다.
Note: 이 속성은 함께 사용되어야합니다 변환 속성입니다.
브라우저 지원
transformOrigin 속성은 인터넷 익스플로러 10, 파이어 폭스, 오페라에서 지원됩니다.
인터넷 익스플로러 9는하지만 2D-변환을위한 대안의 msTransformOrigin 속성을 지원합니다.
크롬, 사파리, 오페라는 2D- 및 3D-transfoms 모두의 방법은 WebkitTransformOrigin 속성을 지원합니다.
통사론
transformOrigin 속성을 반환합니다 :
object .style.transformOrigin transformOrigin 속성을 설정 :
object .style.transformOrigin=" 속성 값 값 기술 x-axis 뷰를 X 축에 배치되는 위치를 정의. 가능한 값 : - 왼쪽
- 센터
- 권리
- length
- %
y-axis 뷰는 y 축에 위치 정의된다. 가능한 값 : - 상단
- 센터
- 바닥
- length
- %
z-axis 뷰는 z 축에 위치 정의된다 (for 3D transforms) . 가능한 값 : - length
initial 기본값으로이 속성을 설정합니다. 초기 읽기에 대한 inherit 부모 요소에서이 속성을 상속합니다. 대한 상속 읽기
기술적 세부 사항
기본값: 50 % 50 % 0 반환 값 : 문자열, 요소의 변환 - 기원 특성을 나타내는 CSS 버전 CSS3
관련 페이지
자바 스크립트 스타일 개체 : transform property
CSS 참조 : transform-origin property
<스타일 개체