2012-02-02 2 views
0

HTML5에서 애니메이션 지원 주변에 조각화가 있음을 발견했습니다. 이 문제를 해결할 수있는 것이 있는지 궁금한가요? 이 데모 여기 예를 들어표준 HTML5 애니메이션

,

http://www.webkit.org/blog-files/3d-transforms/transform-style.html 

지정 웹킷 특정 변환합니다. 이는 Chrome, Android (주식 브라우저 사용), iOS (주식 브라우저 사용)에서 작동 함을 의미합니다.

그것은 IE, 파이어 폭스, 오페라 모바일에서 작동하지 않는 등

또한 내 안드로이드 2.3.5 그 데모에 제대로 애니메이션이 표시되지 않는 것을 알 수 있습니다.

Firefox도 자신 만의 애니메이션을 출시했습니다.

저는 우리 애플 리케이션이 꽤 많은 애니메이션을 가지고있는 실버 라이트 배경에서 왔습니다. HTML5로 옮기고 싶지만, 문제가 될 수 있습니다.

답변

1

실망시키기는하지만 html5/css3에서 모든 것이 여전히 많이 흐르고 있습니다. 브라우저는 기능을 매우 일찍 구현하여 "가능한 한 멋있"수 있습니다. 표준이 변경 되더라도 기존 스크립트의 기능을 유지하기 위해 어느 시점에서 브라우저 접두사를 추가하기 시작했습니다.

지금은 (다른 것들 중에서) 애니메이션을 위해 CSS에서 여러 정의를 사용하고 심지어 IE9 용 일부 JS 대체를 포함해야합니다. IE10에서 번역 지원을 시작합니다 (IE9에서는 "확대/축소"가있는 해결 방법이 있지만) 당신이 5 접두사 정의 새로운 브라우저 후 표준 정의를 포함하는 경우 http://www.css3files.com/transform/

:

지원되는 기능의 스냅 샷에 대한 체크 아웃 CanIUse.com을 : http://caniuse.com/transforms2d 및 하드웨어 가속 버전도 http://caniuse.com/transforms3d 좀 좋은이 자원이다 대신 그걸 사용합니다 ... 그 외에 : 당신이 멋진 CSS 기능을 사용하려고하면 Google에 "크로스 브라우저"로 togehter 함을 의미하고 마음으로 알기 전까지는 열심히 노력하는 괜찮은 발전기에 대한 링크를 얻어야합니다.

관련 문제