Thuộc tính animation CSS

Định nghĩa và cách sử dụng

animation Thuộc tính là một thuộc tính viết tắt, được sử dụng để thiết lập sáu thuộc tính animation:

Ghi chú:Hãy luôn quy định animation-duration Thuộc tính, nếu không thời gian là 0, thì không phát animation.

Giáo trình CSS3:CSS Animation

HTML DOM Tài liệu tham khảo:animation thuộc tính

Sử dụng thuộc tính viết tắt, gắn animation với phần tử div:

div
{
animation:mymove 5s infinite;
}

animation: name duration timing-function delay iteration-count direction;

Giá trị	Mô tả
animation-name	Định nghĩa tên keyframe cần gắn kết với selector.
animation-duration	Định nghĩa thời gian animation hoàn thành, tính bằng giây hoặc mili giây.
animation-timing-function	Định nghĩa đường cong tốc độ animation.
animation-delay	Định nghĩa thời gian chậm trễ trước khi animation bắt đầu.
animation-iteration-count	Định nghĩa số lần animation nên phát lại.
animation-direction	Định nghĩa có nên lặp lại ngược hướng animation hay không.
animation-fill-mode	Định nghĩa giá trị được áp dụng ngoài thời gian thực hiện animation.
animation-play-state	Định nghĩa animation là đang chạy hay tạm dừng.

Giá trị mặc định:	none 0 ease 0 1 normal
Di truyền:	no
Phiên bản:	CSS3
Cú pháp JavaScript:	object.style.animation="mymove 5s infinite"

Số trong bảng cho biết phiên bản trình duyệt đầu tiên hỗ trợ hoàn toàn thuộc tính này.

Số số với -webkit-、-moz- hoặc -o- trước số là phiên bản đầu tiên của tiền tố được sử dụng.

Chrome	IE / Edge	Firefox	Safari	Opera
Chrome	Edge	Firefox	Safari	Opera
43.0 4.0 -webkit-	10.0	16.0 5.0 -moz-	9.0 4.0 -webkit-	30.0 15.0 -webkit- 12.0 -o-