css3 애니메이션이 크롬에서 작동하지 않습니다.

Question

파이어 폭스에서 작동하는 작은 애니메이션이 있지만 웹킷 브라우저에서는 작동하지 않습니다. 어쩌면 누군가가 내가 한시간 동안 찾은 실수를 보았을 것입니다 ... 그것은 프레지의 일부입니다. 프리젠 테이션과 비슷합니다. 감사합니다.

CSS :

#its.step.present h5{ 

display: inline-block; 
position:absolute; 




animation: aia2 5s linear infinite alternate; 
-moz-animation: aia2 5s linear infinite alternate; 
-webkit-animation: aia2 5s linear infinite alternate; 
-ms-animation: aia2 5s linear infinite alternate; 
-o-animation: aia2 5s linear infinite alternate; 

-moz-animation-delay: 4s; 
-webkit-animation-delay: 4s; 
-ms-animation-delay: 4s; 
-o-animation-delay: 4s; 
animation-delay: 4s; 


} 
@-moz-keyframes aia2{ 
    0%{ 

     left:120px; 
     -moz-transform:scale(1) rotate(0deg); 
     -webkit-transform:scale(1) rotate(0deg); 
     -ms-transform:scale(1) rotate(0deg); 
     -o-transform:scale(1) rotate(0deg); 
     transform:scale(1) rotate(0deg); 

     color: red; 
    } 
    90%{ 
     left: 580px; 

     -moz-transform:scale(1) rotate(2000deg); 
     -webkit-transform:scale(1) rotate(2000deg); 
     -ms-transform:scale(1) rotate(2000deg); 
     -o-transform:scale(1) rotate(2000deg); 
     transform:scale(1) rotate(2000deg); 

    } 
    100%{ 
     left: 580px; 


    } 
} 

HTML :

<div id="its" class="step" data-x="850" data-y="3000" data-rotate="90" data-scale="5"> 
     <p> 
      <ul> 
       <li>Web Development,</li> 
       <li>Web Design,</li> 
       <li>Log<h5>o</h5>&nbsp;&nbsp; Design,</li> 
       <li>Web Marketing,</li> 
      </ul> 

      <ul class="doua"> 
       <li><h6>e</h6>&nbsp;&nbsp;Commerce,</li> 
       <li>CMS (WP, J, D),</li> 
       <li>Cust&nbsp; m Apps</li> 
       <li>and others.</li> 
      </ul> 
     </p> 
    </div> 

Answer 1

당신은 브라우저 특정 사람 후에 일반 애니메이션 규칙 을 추가해야한다

-webkit-animation: aia2 5s linear infinite alternate; 
    -moz-animation: aia2 5s linear infinite alternate; 
    -ms-animation: aia2 5s linear infinite alternate; 
    -o-animation: aia2 5s linear infinite alternate; 
     animation: aia2 5s linear infinite alternate; /* this comes last */ 

을 그리고 당신은 -webkit-animation: aia2이 있기 때문에 , -moz-animation: aia2 등 . 다 당신과 같은 각 브라우저의 애니메이션을 설정해야이 지금은 전에하지만 근무 그래서 만약

@-moz-keyframes aia2{ 
    ... 
} 

@-webkit-keyframes aia2{ 
    ... 
} 
@-o-keyframes aia2{ 
    ... 
} 

Answer 2

크롬 V43은 애니메이션의 -webkit- 접두사를 떨어 그것은 아마 이유.