AnimationTimeline: duration-Eigenschaft
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Die duration-Eigenschaft des Web Animations API's AnimationTimeline-Interfaces gibt den Höchstwert für diese Timeline oder null zurück.
Beachten Sie, dass die abgeleiteten Schnittstellen ViewTimeline und ScrollTimeline immer eine Dauer von 100 % zurückgeben, während DocumentTimeline keine Dauer hat und null zurückgibt.
Wert
Eine Zahl, die die Dauer der Timeline (den Höchstwert für diese Timeline) oder null darstellt.
Beispiele
View-Timeline-Dauer
Die ViewTimeline gibt immer eine Dauer von 100% als CSSUnitValue zurück.
js
const subject = document.querySelector(".subject");
const timeline = new ViewTimeline({
subject,
axis: "block",
});
timeline.duration; // CSSUnitValue { value: 100, unit: "percent" }
Scroll-Timeline-Dauer
Die ScrollTimeline gibt immer eine Dauer von 100% als CSSUnitValue zurück.
js
const timeline = new ScrollTimeline({
source: document.documentElement,
axis: "block",
});
timeline.duration; // CSSUnitValue { value: 100, unit: "percent" }
Dokument-Timeline-Dauer
Die DocumentTimeline hat keine Dauer.
js
document.timeline.duration; // null
Spezifikationen
| Specification |
|---|
| Web Animations Level 2 # dom-animationtimeline-duration |
Browser-Kompatibilität
Loading…
Siehe auch
- Web Animations API
AnimationTimelineDocumentTimelineerbt diese EigenschaftScrollTimelineerbt diese EigenschaftViewTimelineerbt diese Eigenschaft