AnimationEvent()

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

AnimationEvent() 생성자는 애니메이션 이벤트인 AnimationEvent 객체를 새로 만들어 리턴합니다. 

문법

animationEvent = new AnimationEvent(type, {animationName: aPropertyName, 
                                           elapsedTime  : aFloat, 
                                           pseudoElement: aPseudoElementName});

매개 변수

AnimationEvent() 생성자는 인자를 Event() 객체로부터 상속받습니다. 

type
DOMString는 AnimationEvent 타입의 이름을 나타냅니다. 대소문자를 구별하며, 'animationstart', 'animationend', 또는 'animationiteration' 와 같이 쓸 수 있습니다.
animationName Optional
DOMString는 animation-name의 변화와 관련된 CSS 프로퍼티 값을 포함합니다. 디폴트 값은 "" 입니다.
elapsedTime Optional

float 타입 값이며 이벤트가 발생할 시, 애니메이션이 정지했던 시간을 제외하고 실제 실행되었던 시간을 초 단위로 받습니다. "animationstart" 이벤트의 경우, animation-delay의 네비게이트 값이 존재하지 않는다면 elapsedTime은 0.0이고, 네비게이트 값이 존재한다면 elapsedTime이 (-1 * delay)값이 되고 이벤트가 발생하게 됩니다. 디폴트 값은 0.0입니다.

pseudoElement Optional
"::"로 시작하는 DOMString 이고, 애니메이션이 실행되는 pseudo-element의 이름을  포함합니다. 애니메이션이 pseudo-element에서 실행되지 않고, 원소 자체에서 실행된다면 빈 스트링 : ""을 명시하십시오. 디폴트 값은 "" 입니다.

리턴 값

주어진 옵션에 의해 초기화된 AnimationEvent

상세

Specification Status Comment
CSS Animations
The definition of 'AnimationEvent()' in that specification.
Working Draft 초기 정의

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
AnimationEvent
Experimental
Chrome Full support 43Edge ? Firefox Full support 23IE No support NoOpera No support NoSafari No support NoWebView Android Full support 43Chrome Android Full support 43Firefox Android Full support 23Opera Android No support NoSafari iOS ? Samsung Internet Android Full support 4.0

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.

함께 보기