>웹 프론트엔드 >JS 튜토리얼 >JavaScript는 css3 애니메이션 end_javascript 기술에 대한 콜백 함수를 결정합니다.

JavaScript는 css3 애니메이션 end_javascript 기술에 대한 콜백 함수를 결정합니다.

WBOY
WBOY원래의
2016-05-16 16:10:451365검색

CSS3 시대에는 CSS3--애니메이션으로 모든 것이 가능합니다

기존 js는 콜백 함수를 통해 애니메이션 종료 여부를 결정할 수 있습니다. CSS 기술을 사용하여 애니메이션 효과를 생성하더라도 JavaScript는 여전히 애니메이션 또는 변환의 종료 이벤트를 캡처할 수 있습니다.

transitionend 이벤트와 animationend 이벤트는 표준 브라우저 이벤트이지만 WebKit 브라우저에서는 여전히 webkit 접두사를 사용해야 하므로 다양한 브라우저에 따라 이벤트를 별도로 감지해야 합니다

코드 복사 코드는 다음과 같습니다.
var 전환 = {
        '전환':'전환 종료',
        'OTransition':'oTransitionEnd',
        'MozTransition':'전환 종료',
        'WebkitTransition':'webkitTransitionEnd'
}

아래 소스코드를 첨부합니다.

코드 복사 코드는 다음과 같습니다.




suface js는 CSS 애니메이션 종료 여부를 결정합니다


콜백 함수는 애니메이션이나 변환이 끝나면 실행됩니다. 대규모 클래스 라이브러리 지원은 더 이상 필요하지 않습니다.