我有手风琴滑块。使用CSS3是他们使用jquery使滑块自动旋转的一种方式,但只使用纯css3动画?这是我网站的网址。
发布于 2013-05-06 09:59:10
是像这样吗?
http://jsfiddle.net/coma/bXDHE/30/
<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; }
}https://stackoverflow.com/questions/15623703
复制相似问题