ตัวอย่าง
ขอให้ผลการเปลี่ยนแปลงสุดท้ายเป็นเวลา 5 วินาที:
div {
-webkit-transition-duration: 5s; /* Safari */
transition-duration: 5s;
}
ลองตัวเอง» ความหมายและการใช้งาน
สถานที่ให้บริการการเปลี่ยนแปลงระยะเวลาการระบุวิธีการหลายวินาที (s) หรือมิลลิวินาที (ms) ผลการเปลี่ยนแปลงที่จะใช้เวลาที่จะเสร็จสมบูรณ์
ค่าเริ่มต้น: | 0s |
---|---|
รับการถ่ายทอด: | no |
Animatable: | no. Read about animatable |
เวอร์ชัน: | CSS3 |
ไวยากรณ์ javascript: | object .style.transitionDuration="1s" Try it |
สนับสนุนเบราว์เซอร์
ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่ทรัพย์สิน
ตามด้วยหมายเลข -webkit-, -moz- หรือ -o- ระบุรุ่นแรกที่ทำงานร่วมกับคำนำหน้า
คุณสมบัติ | |||||
---|---|---|---|---|---|
transition-duration | 26.0 4.0 -webkit- | 10.0 | 16.0 4.0 -moz- | 6.1 3.1 -webkit- | 12.1 10.5 -o- |
CSS ไวยากรณ์
transition-duration:time|initial|inherit;
ค่าทรัพย์สิน
ความคุ้มค่า | ลักษณะ |
---|---|
time | ระบุวิธีการหลายวินาทีหรือมิลลิวินาทีผลการเปลี่ยนแปลงที่จะใช้เวลาที่จะเสร็จสมบูรณ์ ค่าเริ่มต้นคือ 0s หมายถึงจะไม่มีผลกระทบ |
initial | การตั้งค่าคุณสมบัตินี้เป็นค่าเริ่มต้น อ่านเกี่ยวกับการเริ่มต้น |
inherit | สืบทอดคุณสมบัตินี้จากองค์ประกอบหลักของมัน อ่านเกี่ยวกับการรับมรดก |
หน้าเว็บที่เกี่ยวข้อง
กวดวิชา CSS: CSS3 Transitions
อ้างอิง HTML DOM: transitionDuration property