如何添加转换到CSS3动画步骤

Question

我有一些想要使用css逐个自动显示的图像。我正在使用动画。这很好。

  

http://jsfiddle.net/vinnizworld/Sap24/

但是我怎样才能为动画的每一步添加过渡。

Answer 1

@-webkit-keyframes move{
  0%{ margin-left: 0;  }
  10%{    margin-left: -440px;  }
  100%{    margin-left: -5440px;  }
}

from和to是方便的关键字，但使用%您可以根据需要添加任意数量的步骤。

Answer 2

你想要http://jsfiddle.net/Sap24/2/吗？写得像这样：

.img-wrapper{
            width: 9999px;
            margin-left: 0;
            z-index: -1;
            -webkit-animation:move 25s linear infinite;
        }