Thuộc tính animation-direction CSS

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

animation-direction Thuộc tính xác định liệu animation nên phát lại theo thứ tự ngược hay không.

Nếu giá trị của animation-direction là "alternateNếu để trống (""), animation sẽ phát bình thường ở các lần lẻ (1, 3, 5, v.v.) và phát ngược lại ở các lần chẵn (2, 4, 6, v.v.).

Chú ý:Nếu thiết lập animation chỉ phát một lần, thuộc tính này không có hiệu quả.

Xem thêm:

Hướng dẫn CSS3:CSS Animation

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

Mẫu

Dừng animation:

div {
  animation-direction: alternate;
}

Thử ngay

Cú pháp CSS

animation-direction: normal|alternate;
Giá trị Mô tả Kiểm tra
normal Giá trị mặc định. Animation nên phát lại theo thứ tự bình thường. Kiểm tra
alternate Animation nên phát lại theo thứ tự ngược. Kiểm tra

Chi tiết kỹ thuật

Giá trị mặc định: normal
Kế thừa: no
Phiên bản: CSS3
Cú pháp JavaScript: object.style.animationDirection="alternate"

Hỗ trợ trình duyệt

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

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

Chrome 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-