ตัวอย่าง
เลื่อนเมาส์ไปที่ส่วน div ที่จะค่อยๆเปลี่ยนความกว้างและความสูงของมัน
document.getElementById("myDIV").style.transitionProperty = "width,height";
ลองตัวเอง» ความหมายและการใช้งาน
คุณสมบัติ transitionProperty ระบุชื่อของคุณสมบัติ CSS ผลการเปลี่ยนแปลงคือสำหรับ (ผลการเปลี่ยนแปลงจะเริ่มเมื่อระบุการเปลี่ยนแปลงคุณสมบัติ CSS)
Tip: ผลการเปลี่ยนแปลงโดยปกติจะเกิดขึ้นเมื่อผู้ใช้เลื่อนมากกว่าองค์ประกอบ
Note: เสมอระบุคุณสมบัติ transitionDuration มิฉะนั้นระยะเวลาเป็น 0 และการเปลี่ยนแปลงจะไม่มีผลกระทบ
สนับสนุนเบราว์เซอร์
คุณสมบัติ transitionProperty ได้รับการสนับสนุนใน Internet Explorer 10, Firefox, Opera และ Chrome
ซาฟารีสนับสนุนทางเลือกคุณสมบัติ WebkitTransitionProperty
หมายเหตุ: คุณสมบัติ transitionProperty จะไม่ได้รับการสนับสนุนใน Internet Explorer 9 และรุ่นก่อนหน้า
วากยสัมพันธ์
กลับ transitionProperty ทรัพย์สิน:
object .style.transitionProperty ตั้ง transitionProperty ทรัพย์สิน:
object .style.transitionProperty="none|all| ค่าทรัพย์สิน ความคุ้มค่า ลักษณะ none ไม่มีทรัพย์สินจะได้รับผลกระทบการเปลี่ยนแปลง all ค่ามาตรฐาน คุณสมบัติทั้งหมดจะได้รับผลกระทบการเปลี่ยนแปลง property กำหนดรายการคั่นด้วยเครื่องหมายจุลภาคของชื่อคุณสมบัติ CSS ผลการเปลี่ยนแปลงสำหรับ initial ตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น อ่านเกี่ยวกับการเริ่มต้น inherit สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก
รายละเอียดทางเทคนิค
ราคาเริ่มต้น: ทั้งหมด กลับค่า: สตริงที่เป็นตัวแทนของสถานที่ให้บริการการเปลี่ยนแปลงคุณสมบัติขององค์ประกอบ CSS รุ่น CSS3
หน้าเว็บที่เกี่ยวข้อง
อ้างอิง CSS: transition-property property
<สไตล์วัตถุ