css3滑塊自動旋轉

Question

我有一個手風琴滑塊。這是使用CSS3是他們的方式來使滑塊自動旋轉出來使用jQuery的，但只有純css3動畫？ Here is the URL to my site.

Answer 1

是這樣的？

http://jsfiddle.net/coma/bXDHE/30/

HTML

<div class="neat"> 
    <div> 
     <img src="http://www.menucool.com/slider/prod/image-slider-4.jpg"/> 
     <img src="http://blogs.mathworks.com/pick/files/zebrainpastelfield.png"/> 
     <img src="http://www.freewarepocketpc.net/wp7/img/image-effecter-free.png"/> 
     <img src="http://www.poyraz.gen.tr/wp-content/uploads/images_4781_1.jpg"/> 
    </div> 
</div> 

CSS

div.neat { 
    font-size: 500px; 
    width: 1em; 
    height: 200px; 
    overflow: hidden; 
} 

div.neat > div { 
    position: relative; 
    left: 0; 
    width: 4em; 
    -webkit-animation: loop 10s infinite; 
    -moz-animation: loop 10s infinite; 
} 

div.neat > div > img { 
    width: 1em; 
    display: block; 
    float: left; 
} 

@-webkit-keyframes loop { 
    0% { left: 0; } 
    20% { left: 0; } 
    25% { left: -1em; } 
    45% { left: -1em; } 
    50% { left: -2em; } 
    70% { left: -2em; } 
    75% { left: -3em; } 
    95% { left: -3em; } 
} 

@-moz-keyframes loop { 
    0% { left: 0; } 
    20% { left: 0; } 
    25% { left: -1em; } 
    45% { left: -1em; } 
    50% { left: -2em; } 
    70% { left: -2em; } 
    75% { left: -3em; } 
    95% { left: -3em; } 
}