คุณสมบัติ Style animation

การระบุและใช้งาน

การสนับสนุนบราวเซอร์ คุณสมบัติเป็นคุณสมบัติสั้นแบบของหกคุณสมบัติการเคลื่อนไหว:

หมายเหตุ:ให้กำหนดเสมอ คุณสมบัติ animationDurationหากไม่กำหนด จะมีระยะเวลา 0 และจะไม่เล่นตามไปเลย。

ตัวอย่าง

ใช้คุณสมบัติสั้นแบบเพื่อเปลี่ยนแปลงเครื่องมือเรียกใช้การเคลื่อนไหวของ <div> ได้:

document.getElementById("myDIV").style.animation = "mynewmove 4s 2";

ทดลองด้วยตัวเอง

รูปแบบการใช้งาน

กลับค่าคุณสมบัติ animation:

object.style.animation

ตั้งคุณสมบัติ animation:

object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"

ค่าทางสมบัติ

ค่า คำอธิบาย
animationName กำหนดชื่อฟิล์มเคย์โฟร์มที่จะจับออกมาเพื่อโซนซับจังหวะ
animationDuration กำหนดเวลาที่จะใช้ในการแอนิเมชัน
animationTimingFunction กำหนดความเร็วของการแอนิเมชัน
animationDelay animationDelay
กำหนดช่วงเวลาหลังจากที่อนุญาตให้การแอนิเมชันเริ่มต้น animationIterationCount
กำหนดว่าการแอนิเมชันจะเล่นเท่าไรครั้ง animationDirection
กำหนดว่าการแอนิเมชันจะเล่นซ้ำหรือไม่ในระบบวนโครง animationFillMode
กำหนดค่าที่นอกเหนือจากเวลาที่กำหนดในการปฏิบัติการ animationPlayState
ตั้งคุณสมบัตินี้เป็นค่าเริ่มต้น โปรดดู กำหนดว่าอนุญาตให้การแอนิเมชันทำงานหรือหยุด ตั้งคุณสมบัตินี้เป็นค่าเริ่มต้น โปรดดูสตริง ที่แสดงความหมายขององค์ประกอบขององค์ประกอบ
จากองค์ประกอบพ่อของตน ขอใช้การเพื่อคุณสมบัตินี้ โปรดดู initial จากองค์ประกอบพ่อของตน ขอใช้การเพื่อคุณสมบัตินี้ โปรดดูสตริง ที่แสดงความหมายขององค์ประกอบขององค์ประกอบ

inherit

รายละเอียดเทคนิค ค่าเริ่มต้น:
none 0 ease 0 1 normal none running ค่าที่กลับมา: ข้อมูล CSS ทั้งหมดสตริง ที่แสดงความหมายขององค์ประกอบขององค์ประกอบ
เอกสาร CSS:

CSS3

การสนับสนุนบราวเซอร์ animation

เป็นคุณสมบัติ CSS3 (1999) ของ CSS3。

ทุกบราวเซอร์สนับสนุนอย่างเต็มที่: Chrome Edge Firefox Safari Opera
ทุกบราวเซอร์สนับสนุนอย่างเต็มที่: Chrome Edge Firefox Safari Opera
IE IE IE IE IE สนับสนุน

11

หน้าที่เกี่ยวข้องข้อมูล CSS ทั้งหมด