Html
    Css
    Js
1
2
3
4
5
6
7
8
9
10
<div class="stage">
<div class="container">
<div class="side front"></div>
<div class="side back"></div>
<div class="side left"></div>
<div class="side right"></div>
<div class="side top"></div>
<div class="side bottom"></div>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
@-webkit-keyframes spin {
0% {
-webkit-transform:rotateY(0deg);
transform:rotateY(0deg)
}
100% {
-webkit-transform:rotateY(360deg);
transform:rotateY(360deg)
}
}@-moz-keyframes spin {
0% {
-moz-transform:rotateY(0deg);
transform:rotateY(0deg)
}
100% {
-moz-transform:rotateY(360deg);
transform:rotateY(360deg)
}
}@-ms-keyframes spin {
0% {
-ms-transform:rotateY(0deg);
transform:rotateY(0deg)
}
100% {
-ms-transform:rotateY(360deg);
transform:rotateY(360deg)
}
}@-o-keyframes spin {
0% {
-o-transform:rotateY(0deg);
transform:rotateY(0deg)
}
100% {
-o-transform:rotateY(360deg);
transform:rotateY(360deg)
}
}@keyframes spin {
0% {
transform:rotateY(0deg)
}
100% {
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

3D盒子(原创)

这是个简单的3d盒子,可移动鼠标旋转

0