Translate

[Android][CSS] Android 4.0.x 이하에서 CSS3 (transition, transform) 속성이 적용되지 않는경우



증상

Android 4.4.x
  - OEM(기본) Browser, Chrome 모두 transition 속성이 정상적으로 적용됨

Android 4.0.x, 4.1.x
  - transition 속성이 Chrome 에서는 적용되나 OEM Browser 에서만 적용되지 않음.





수정방법

Android 4.1.x 및 4.0.x 이하의버전에서는 OEM Browser에서 transition 속성을 사용시 webkit prefix 를 붙인 송성을 추가해야 정상적으로 작동을 한다.
(4.2.x 및 4.3.x 에서는 테스트를 해보지 못했다.)



 원래 속성
 transition-duration: 1s;

 수정 속성
 transition-duration: 1s;
 -webkit-transition-duration: 1s;




PS.
Webkit 에서는 -webkit-
Firefox 에서는 -moz-
Opera 에서는 -o-

를 붙여줘야 하는걸 알고있긴 했지만 프로토타입을 만드는 거라 대충만들었더니 생각도 못하고 삽질을 했네;;


댓글