ตัวอย่าง
หมุนส่วน div นี้:
document.getElementById("myDIV").style.transform = "rotate(7deg)";
ลองตัวเอง» ความหมายและการใช้งาน
สถานที่ให้บริการเปลี่ยนใช้การแปลง 2D หรือ 3D เพื่อองค์ประกอบ คุณสมบัตินี้จะช่วยให้คุณสามารถหมุน, ขนาด, ย้ายเอียง ฯลฯ องค์ประกอบ
สนับสนุนเบราว์เซอร์
สถานที่ให้บริการแปลงได้รับการสนับสนุนใน Internet Explorer และ Firefox 10
Internet Explorer 9 สนับสนุนทางเลือกคุณสมบัติ msTransform (2D transforms only)
Opera, Chrome และ Safari สนับสนุนทางเลือกที่คุณสมบัติ WebkitTransform นี้ (3D และ 2D แปลง)
วากยสัมพันธ์
กลับแปลงทรัพย์สิน:
object .style.transform ตั้งค่าการแปลงทรัพย์สิน:
object .style.transform="none| ค่าทรัพย์สิน ความคุ้มค่า ลักษณะ none กำหนดว่าควรจะมีการเปลี่ยนแปลงใด ๆ matrix( n,n,n,n,n,n ) กำหนดเปลี่ยนแปลง 2D โดยใช้เมทริกซ์ของหกค่า matrix3d
( n,n,n,n,n,n,n,n,n,n,n,n,n,n,n,n ) กำหนดให้การเปลี่ยนแปลง 3 มิติโดยใช้เมทริกซ์ 4x4 16 ค่า translate( x,y ) กำหนดแปล 2D translate3d( x,y,z ) กำหนดแปล 3D translateX( x ) กำหนดแปลโดยใช้เพียงค่าสำหรับแกน X translateY( y ) กำหนดแปลโดยใช้เพียงค่าสำหรับแกน Y translateZ( z ) กำหนดแปล 3D โดยใช้เพียงค่าสำหรับแกน Z scale( x,y ) กำหนดให้การเปลี่ยนแปลงขนาด 2D scale3d( x,y,z ) กำหนดให้การเปลี่ยนแปลงขนาด 3D scaleX( x ) กำหนดขนาดการเปลี่ยนแปลงโดยให้ค่าสำหรับแกน X scaleY( y ) กำหนดขนาดการเปลี่ยนแปลงโดยให้ค่าสำหรับแกน Y scaleZ( z ) กำหนดให้การเปลี่ยนแปลงขนาด 3 มิติโดยการให้ค่าสำหรับแกน Z rotate( angle ) กำหนดหมุน 2D, มุมที่ระบุไว้ในพารามิเตอร์ rotate3d( x,y,z,angle ) กำหนดหมุน 3D rotateX( angle ) กำหนดหมุน 3D พร้อมแกน X rotateY( angle ) กำหนดหมุน 3D พร้อมแกน Y rotateZ( angle ) กำหนดหมุน 3D พร้อมแกน Z skew( x-angle,y-angle ) กำหนดเปลี่ยนแปลงเอียง 2D พร้อมแกน X และแกน Y skewX( angle ) กำหนดเปลี่ยนแปลงเอียง 2D ตามแนวแกน X skewY( angle ) กำหนดเปลี่ยนแปลงเอียง 2D ตามแนวแกน Y perspective( n ) กำหนดมุมมองมุมมองสำหรับองค์ประกอบ 3D เปลี่ยน initial ตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น อ่านเกี่ยวกับการเริ่มต้น inherit สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก
รายละเอียดทางเทคนิค
ราคาเริ่มต้น: ไม่มี กลับค่า: สตริงที่เป็นตัวแทนของการแปลงทรัพย์สินขององค์ประกอบ CSS รุ่น CSS3
หน้าเว็บที่เกี่ยวข้อง
อ้างอิง CSS: transform property
<สไตล์วัตถุ