크롬을 사용한 css3 변환 문제

Question

SVG 내부의 객체는 간단한 전환 스타일을 가지고 있지만 크롬에 문제가있어 객체가 깨져서 부드럽게 전환 할 수 없습니다.

의견이 있으십니까? 는 이미 이와 같은 게시물을 많이 읽게하고 그들 중 누구도 할 수 없습니다 : 는 http://www.sitepoint.com/fix-chrome-animation-flash-bug/

이 스타일은 문제가 변경되지 않습니다

-webkit-backface-visibility: hidden; -webkit-transform: scale(1);

<pre> 
<style> 
.irwild:hover , .comwild:hover , .irstd:hover , .comstd:hover { 
transform: translate(-30px); 
-ms-transform: translate(-30px); 
-webkit-transform: translate(-30px);} 

.irwild , .comwild , .irstd , .comstd { 
-webkit-backface-visibility: hidden; 
-moz-backface-visibility: hidden; 
-ms-backface-visibility:  hidden; 
backface-visibility:  hidden; 
-webkit-transition: all 0.5s ease-in-out; 
-moz-transition: all 0.5s ease-in-out; 
-o-transition: all 0.5s ease-in-out;} 
</style> 
</pre> 

Answer 1

당신은 어려움 애니메이션 사용이있는 경우 -webkit-transform : translateZ (0); 크롬이 하드웨어 가속을 사용하도록합니다.