Animation: thuộc tính currentTime

Giá trị

Một số biểu diễn thời gian hiện tại tính bằng mili giây, hoặc null để vô hiệu hóa hoạt ảnh.

Ví dụ

Trong trò chơi Drink Me/Eat Me, chiều cao của Alice được tạo hoạt ảnh để nó có thể chuyển từ nhỏ sang lớn hoặc từ lớn sang nhỏ. Ở đầu trò chơi, chiều cao của cô ấy được đặt vào giữa hai cực trị bằng cách đặt currentTime của hoạt ảnh bằng một nửa thời lượng của KeyframeEffect:

aliceChange.currentTime = aliceChange.effect.timing.duration / 2;

Một cách tổng quát hơn để đưa hoạt ảnh tới mốc 50% là:

animation.currentTime =
  animation.effect.getComputedTiming().delay +
  animation.effect.getComputedTiming().activeDuration / 2;

Độ chính xác thời gian bị giảm

Để bảo vệ khỏi tấn công dựa trên thời gian và fingerprinting, độ chính xác của animation.currentTime có thể bị làm tròn tùy theo thiết lập trình duyệt. Trong Firefox, tùy chọn privacy.reduceTimerPrecision được bật mặc định và mặc định là 2ms. Bạn cũng có thể bật privacy.resistFingerprinting, khi đó độ chính xác sẽ là 100ms hoặc giá trị của privacy.resistFingerprinting.reduceTimerPrecision.microseconds, tùy giá trị nào lớn hơn.

Ví dụ, với độ chính xác thời gian bị giảm, kết quả của animation.currentTime sẽ luôn là bội số của 0.002, hoặc bội số của 0.1 (hoặc privacy.resistFingerprinting.reduceTimerPrecision.microseconds) khi bật privacy.resistFingerprinting.

// độ chính xác thời gian bị giảm (2ms) trong Firefox 60
animation.currentTime;
// Có thể là:
// 23.404
// 24.192
// 25.514
// …

// độ chính xác thời gian bị giảm với `privacy.resistFingerprinting` được bật
animation.currentTime;
// Có thể là:
// 49.8
// 50.6
// 51.7
// …

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• Animation cho các phương thức và thuộc tính khác bạn có thể dùng để điều khiển hoạt ảnh của trang web.
• Animation.startTime cho biết thời điểm hoạt ảnh được lên lịch bắt đầu.
• Web Animations API