Skip to content
This repository
Browse code

Homepage animation loop fix

  • Loading branch information...
commit 93953fb940d6409841c9ebfedf0bf61f68a3bb62 1 parent 31a5801
Brad Frost authored September 10, 2012

Showing 1 changed file with 42 additions and 48 deletions. Show diff stats Hide diff stats

  1. 90  animation.css
90  animation.css
... ...
@@ -1,74 +1,68 @@
1  
-.ani div b {
2  
-	-webkit-animation-direction: alternate;
3  
-	-moz-animation-direction: alternate;
4  
-	-ms-animation-direction: alternate;
5  
-	-o-animation-direction: alternate;
6  
-}
  1
+
7 2
 .ani div.a1 b {
8  
-	-webkit-animation: box-resize 10s infinite;
9  
-	-moz-animation: box-resize 10s infinite;
10  
-	-ms-animation: box-resize 10s infinite;
11  
-	-o-animation: box-resize 10s infinite;
  3
+	-webkit-animation: box-resize 10s infinite alternate both;
  4
+	-moz-animation: box-resize 10s infinite alternate both;
  5
+	-ms-animation: box-resize 10s infinite alternate both;
  6
+	-o-animation: box-resize 10s infinite alternate both;
12 7
 }
13 8
 .ani div.a2 b {
14  
-	-webkit-animation: box-resize2 10s infinite;
15  
-	-moz-animation: box-resize2 10s infinite;
16  
-	-ms-animation: box-resize2 10s infinite;
17  
-	-o-animation: box-resize2 10s infinite;
  9
+	-webkit-animation: box-resize2 10s infinite alternate both;
  10
+	-moz-animation: box-resize2 10s infinite alternate both;
  11
+	-ms-animation: box-resize2 10s infinite alternate both;
  12
+	-o-animation: box-resize2 10s infinite alternate both;
18 13
 
19 14
 }
20 15
 .ani div.a3 b {
21  
-	-webkit-animation: box-resize3 10s infinite;
22  
-	-moz-animation: box-resize3 10s infinite;
23  
-	-ms-animation: box-resize3 10s infinite;
24  
-	-o-animation: box-resize3 10s infinite;
  16
+	-webkit-animation: box-resize3 10s infinite alternate both;
  17
+	-moz-animation: box-resize3 10s infinite alternate both;
  18
+	-ms-animation: box-resize3 10s infinite alternate both;
  19
+	-o-animation: box-resize3 10s infinite alternate both;
25 20
 
26 21
 }
27 22
 .ani div.a4 b {
28  
-	-webkit-animation: box-resize4 10s infinite;
29  
-	-moz-animation: box-resize4 10s infinite;
30  
-	-ms-animation: box-resize4 10s infinite;
31  
-	-o-animation: box-resize4 10s infinite;
32  
-
  23
+	-webkit-animation: box-resize4 10s infinite alternate both;
  24
+	-moz-animation: box-resize4 10s infinite alternate both;
  25
+	-ms-animation: box-resize4 10s infinite alternate both;
  26
+	-o-animation: box-resize4 10s infinite alternate both;
33 27
 }
34 28
 .ani div.a5 b {
35  
-	-webkit-animation: box-resize5 10s infinite;
36  
-	-moz-animation: box-resize5 10s infinite;
37  
-	-ms-animation: box-resize5 10s infinite;
38  
-	-o-animation: box-resize5 10s infinite;
  29
+	-webkit-animation: box-resize5 10s infinite alternate both;
  30
+	-moz-animation: box-resize5 10s infinite alternate both;
  31
+	-ms-animation: box-resize5 10s infinite alternate both;
  32
+	-o-animation: box-resize5 10s infinite alternate both;
39 33
 
40 34
 }
41 35
 .ani div.a6 b {
42  
-	-webkit-animation: box-resize6 10s infinite;
43  
-	-moz-animation: box-resize6 10s infinite;
44  
-	-ms-animation: box-resize6 10s infinite;
45  
-	-o-animation: box-resize6 10s infinite;
  36
+	-webkit-animation: box-resize6 10s infinite alternate both;
  37
+	-moz-animation: box-resize6 10s infinite alternate both;
  38
+	-ms-animation: box-resize6 10s infinite alternate both;
  39
+	-o-animation: box-resize6 10s infinite alternate both;
46 40
 
47 41
 }
48 42
 .ani div.a7 b {
49  
-	-webkit-animation: box-resize7 10s infinite;
50  
-	-moz-animation: box-resize7 10s infinite;
51  
-	-ms-animation: box-resize7 10s infinite;
52  
-	-o-animation: box-resize7 10s infinite;
  43
+	-webkit-animation: box-resize7 10s infinite alternate both;
  44
+	-moz-animation: box-resize7 10s infinite alternate both;
  45
+	-ms-animation: box-resize7 10s infinite alternate both;
  46
+	-o-animation: box-resize7 10s infinite alternate both;
53 47
 
54 48
 }
55 49
 .ani div.a8 b {
56  
-	-webkit-animation: box-resize8 10s infinite;
57  
-	-moz-animation: box-resize8 10s infinite;
58  
-	-ms-animation: box-resize8 10s infinite;
59  
-	-o-animation: box-resize8 10s infinite;
  50
+	-webkit-animation: box-resize8 10s infinite alternate both;
  51
+	-moz-animation: box-resize8 10s infinite alternate both;
  52
+	-ms-animation: box-resize8 10s infinite alternate both;
  53
+	-o-animation: box-resize8 10s infinite alternate both;
60 54
 }
61 55
 .ani div.a9 b {
62  
-	-webkit-animation: box-resize9 10s infinite;
63  
-	-moz-animation: box-resize9 10s infinite;
64  
-	-ms-animation: box-resize9 10s infinite;
65  
-	-o-animation: box-resize9 10s infinite;
  56
+	-webkit-animation: box-resize9 10s infinite alternate both;
  57
+	-moz-animation: box-resize9 10s infinite alternate both;
  58
+	-ms-animation: box-resize9 10s infinite alternate both;
  59
+	-o-animation: box-resize9 10s infinite alternate both;
66 60
 }
67 61
 .ani div.a10 b {
68  
-	-webkit-animation: box-resize10 10s infinite;
69  
-	-moz-animation: box-resize10 10s infinite;
70  
-	-ms-animation: box-resize10 10s infinite;
71  
-	-o-animation: box-resize10 10s infinite;
  62
+	-webkit-animation: box-resize10 10s infinite alternate both;
  63
+	-moz-animation: box-resize10 10s infinite alternate both;
  64
+	-ms-animation: box-resize10 10s infinite alternate both;
  65
+	-o-animation: box-resize10 10s infinite alternate both;
72 66
 }
73 67
 
74 68
 /*Fluid Animation*/
@@ -138,7 +132,7 @@
138 132
 
139 133
 }
140 134
 @-webkit-keyframes box-resize4 {
141  
-	0% { top: 31%; right: 35%; bottom: 31%; left: 35%;  }
  135
+	0% { top: 31%; right: 35%; bottom: 31%; left: 35%; }
142 136
 	50% { top: 19.2%; right: 29.333%; bottom: 19.2%; left: 29.333%; }
143 137
 	100% { top: 14.7%; right: 13%; bottom: 14.7%; left: 13%; }
144 138
 }

0 notes on commit 93953fb

Please sign in to comment.
Something went wrong with that request. Please try again.