CSSAnimation
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2020.
Giao diện CSSAnimation của Web Animations API đại diện cho một đối tượng Animation.
Thuộc tính phiên bản
Giao diện này kế thừa các thuộc tính từ lớp cha Animation.
CSSAnimation.animationNameRead only-
Trả về tên hoạt hình dưới dạng chuỗi.
Phương thức phiên bản
Giao diện này kế thừa các phương thức từ lớp cha Animation.
Ví dụ
Kiểm tra CSSAnimation được trả về
Hoạt hình trong ví dụ dưới đây được định nghĩa trong CSS với tên slide-in. Gọi Element.getAnimations() trả về một mảng tất cả các đối tượng Animation. Trong trường hợp này, nó trả về một đối tượng CSSAnimation, đại diện cho hoạt hình được tạo trong CSS.
css
.animate {
animation: slide-in 0.7s both;
}
@keyframes slide-in {
0% {
transform: translateY(-1000px);
}
100% {
transform: translateY(0);
}
}
js
let animations = document.querySelector(".animate").getAnimations();
console.log(animations[0]);
Thông số kỹ thuật
| Thông số kỹ thuật |
|---|
| CSS Animations Level 2 # the-CSSAnimation-interface |