小编Tal*_*tro的帖子

CSS3动画在Android 4.2上不起作用

我正在使用Worklight开发一个应用程序,我需要使用CSS放置一个小的动画图像.在4.4版本的Android设备上运行完美,我在Android 4.2和4.1的设备上进行了一些测试,同样的动画也不起作用.iPhone 5运行正常.

我的代码是:

<html>

    <style type="text/css">

        .image-arrow {
          content: url("http://i104.photobucket.com/albums/m163/bl82/arrowup-green.png");
          /* content: url("hand.png"); */
          /* display: inline-block; */
          width: 100px;
          text-align: center;
          margin: auto;
          overflow: visible;  
          /* position: absolute; */
        }

        .element-animation{
          -webkit-animation: 4.0s ease-in-out;
          -webkit-animation-name: animationFramesWebKit;
          -webkit-animation-iteration-count: 2;
          -webkit-transform-origin: 60% 100%;
        }

        @-webkit-keyframes animationFramesWebKit {
          0% {
            -webkit-transform:  rotate(0deg);
          }
          8% {
            -webkit-transform:  rotate(0deg);
          }
          18% {
            -webkit-transform:  rotate(-25deg) ;
          }
          25% {
            -webkit-transform:  rotate(25deg) ;
          }
          32% {
            -webkit-transform:  rotate(-25deg) ;
          }
          41% {
            -webkit-transform:  rotate(25deg) ; …

Run Code Online (Sandbox Code Playgroud)

animation android css3 cordova ibm-mobilefirst

Tal*_*tro

2014 08-13

3
推荐指数

1
解决办法

4964
查看次数