1<div class="wheelPlayer wheelAnimate">
2 <div>1</div>
3 <div>2</div>
4 <div>3</div>
5</div>
1.wheelPlayer{
2 padding: 20px 0;
3 margin: auto;
4 width: 350px;
5}
6.wheelPlayer div{
7 position: relative;
8 height: 25px;
9 line-height: 26px;
10 width: 70px;
11 text-align: center;
12 border: 1px solid gray;
13}
14.wheelAnimate div{
15 animation: whellPlayer 9s infinite;
16 -moz-animation: whellPlayer 9s infinite;
17 -webkit-animation: whellPlayer 9s infinite;
18}
19.wheelPlayer div:nth-of-type(1){
20 animation-delay: -6s;
21 -moz-animation-delay: -6s;
22 -webkit-animation-delay: -6s;
23}
24.wheelPlayer div:nth-of-type(2){
25 animation-delay: -3s;
26 -moz-animation-delay: -3s;
27 -webkit-animation-delay: -3s;
28 margin-top: -27px;
29}
30.wheelPlayer div:nth-of-type(3){
31 animation-delay: -0s;
32 -moz-animation-delay: 0s;
33 -webkit-animation-delay: 0s;
34 margin-top: -27px;
35}
除另有声明外,本博客文章均采用 知识共享 (Creative Commons) 署名 4.0 国际许可协议 进行许可。转载请注明原作者与文章出处。