2012-09-20 2 views
4

크롬, 사파리 및 모바일 사파리에서 제대로 작동하는이 HTML이 있습니다. 3D css transform (translateZ)이 (가) 안드로이드 4.0.3에서 작동하지 않습니까?

<html><head> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> 
</head> 
<body> 
<div style="position:relative;-webkit-perspective:1000;width:300px;height:50px"> 
<div style="position:relative;width:300px;height:50px;-webkit-transform-origin:0px 25px 0px;-webkit-transform-style:preserve-3d;"> 
<div style="position:absolute;width:300px;height:50px;-webkit-transform:translateZ(125px);background-image:url(http://i855.photobucket.com/albums/ab119/ansherina6/banner2-1.png)"></div> 
</div></div> 
</body></html>

android 4.0.3에서 translateZ는 div에 (원하는) 효과를 표시하지 않습니다. translateZ 외에도 다른 모든 것은 잘 작동합니다. translate3D (a, b, c)를 사용하면 다시 X와 Y 값만 렌더링에 영향을줍니다. 이 문제를 해결할 수있는 방법이 있습니까?

+1

이 문제와 관련하여 행운이 있었나요? 나는 똑같은 문제에 직면 해있다. – richardtz

답변

0

caniuse에 따르면 translate는 android 4 이상에서 지원됩니다. 그러나 z 축의 변환과 같은보다 구체적인 3D 변환은 특히 웹 글래스를 지원하지 않는 브라우저에서 이러한 광범위한 지원을 얻지 못합니다. 비판적 인 경우 대체로 생각됩니다. transformie

관련 문제