AnimationEvent elapsedTime ominaisuus

Määrittely ja käyttö

elapsedTime-ominaisuus palauttaa animaation suoritetun ajan sekunneissa, kun animaatio tapahtuu.

Huomautus:Jos animaatio keskeytetään (käyttämällä CSS-ominaisuutta animation-delay), palautusarvo ei ole vaikuttanut.

Huomautus:Suhteessa animationstart tapahtuma,tämä ominaisuus palauttaa aina "0".

Huomautus:Tämä ominaisuus on ainoastaan lukuinen.

Esimerkki

Määritä, kuinka monta sekuntia animaatio on suoritettu:

var x = document.getElementById("myDIV");
x.addEventListener("animationiteration", myRepeatFunction);
function myRepeatFunction(event) {
  this.innerHTML = "Ajan kesto: " + event.elapsedTime;
}

Kokeile itse

Syntaksi

event.elapsedTime

Tekninen yksityiskohta

Palautusarvo: Numerovaranto, joka ilmaisee animaation suoritusajan sekunneissa.

Selaimen tuki

Taulukossa olevat numerot osoittavat ensimmäisen selaimen version, joka tukee tätä ominaisuutta täysin.

Ominaisuudet Chrome IE Firefox Safari Opera
elapsedTime Tuki 10.0 6.0 Tuki Tuki

Tiedostot

HTML DOM käyttöohjeet:animationstart tapahtuma

HTML DOM käyttöohjeet:animationiteration tapahtuma

HTML DOM käyttöohjeet:animationend tapahtuma

HTML DOM käyttöohjeet:AnimationEvent animationName ominaisuus

CSS-käyttöohjeet:CSS3 animation ominaisuus

CSS-käyttöohjeet:CSS3 animation-duration ominaisuus