1
2
3
4
5
6
7
天气Demo8
9
10
11 /*div{12 100;13 height:100;14 background: red;15 position: relative;16 animation:mymove 5s infinite;17 }*/
18 .div1{
19 position:relative;
20 animation:mymove 5s infinite;
21 -moz-animation:mymove 5s infinite; /*Firefox*/
22 -webkit-animation:mymove 5s infinite; /*Safari and Chrome*/
23 -o-animation:mymove 5s infinite; /*Opera*/
24 }
25 @keyframes mymove{
26 0% {top:0px;left:0px;}
27 25%{top:0px;left:100px;}
28 50%{top:100px;left:100px;}
29 75%{top:100px;left:0px;}
30 100%{top:0px;left:0px;}
31 }32 @-moz-keyframes mymove/*Firefox*/
33 {
34 0% {top:0px;left:0px;}
35 25%{top:0px;left:100px;}
36 50%{top:100px;left:100px;}
37 75%{top:100px;left:0px;}
38 100%{top:0px;left:0px;}
39 }40
41 @-webkit-keyframes mymove/*Safari and Chrome*/
42 {
43 0% {top:0px;left:0px;}
44 25%{top:0px;left:100px;}
45 50%{top:100px;left:100px;}
46 75%{top:100px;left:0px;}
47 100%{top:0px;left:0px;}
48 }49
50 @-o-keyframes mymove/*Opera*/
51 {
52 0% {top:0px;left:0px;}
53 25%{top:0px;left:100px;}
54 50%{top:100px;left:100px;}
55 75%{top:100px;left:0px;}
56 100%{top:0px;left:0px;}
57 }58
59
60
61
62
63
64