예
애니메이션이 실행 된 몇 초를 찾기 :
var x = document.getElementById("myDIV");
x.addEventListener("animationiteration",
myRepeatFunction);
function myRepeatFunction(event) {
this.innerHTML
= "Elapsed time: " + event.elapsedTime;
}
»그것을 자신을 시도 정의 및 사용
애니메이션 이벤트가 발생하면 elapsedTime 속성은 애니메이션이 실행 된 시간 (초)을 반환합니다.
참고 : 애니메이션이 일시 정지 된 경우 반환 값은 영향을받지 않습니다 (by using the animation-delay CSS property) .
참고 : 들어 animationstart의 경우,이 속성이 항상 반환 "0" .
이 속성은 읽기 전용입니다.
브라우저 지원
테이블의 숫자는 완전히 속성을 지원하는 최초의 브라우저 버전을 지정합니다.
재산 | |||||
---|---|---|---|---|---|
elapsedTime | 예 | 10.0 | 6.0 | 예 | 예 |
통사론
event .elapsedTime
기술적 세부 사항
반환 값 : | 초 애니메이션을 나타내는 번호는 실행 된 |
---|
관련 페이지
HTML DOM 참조 : animationstart 이벤트
HTML DOM 참조 : animationiteration 이벤트
HTML DOM 참조 : animationend 이벤트
HTML DOM 참조 : AnimationEvent animationName Property
CSS 참조 : CSS3 animation Property
CSS 참조 : CSS3 animation-duration Property
<이벤트 객체