Permalink
Browse files

Homepage animation loop fix

  • Loading branch information...
1 parent 31a5801 commit 93953fb940d6409841c9ebfedf0bf61f68a3bb62 @bradfrost committed Sep 10, 2012
Showing with 42 additions and 48 deletions.
  1. +42 −48 animation.css
View
@@ -1,74 +1,68 @@
-.ani div b {
- -webkit-animation-direction: alternate;
- -moz-animation-direction: alternate;
- -ms-animation-direction: alternate;
- -o-animation-direction: alternate;
-}
+
.ani div.a1 b {
- -webkit-animation: box-resize 10s infinite;
- -moz-animation: box-resize 10s infinite;
- -ms-animation: box-resize 10s infinite;
- -o-animation: box-resize 10s infinite;
+ -webkit-animation: box-resize 10s infinite alternate both;
+ -moz-animation: box-resize 10s infinite alternate both;
+ -ms-animation: box-resize 10s infinite alternate both;
+ -o-animation: box-resize 10s infinite alternate both;
}
.ani div.a2 b {
- -webkit-animation: box-resize2 10s infinite;
- -moz-animation: box-resize2 10s infinite;
- -ms-animation: box-resize2 10s infinite;
- -o-animation: box-resize2 10s infinite;
+ -webkit-animation: box-resize2 10s infinite alternate both;
+ -moz-animation: box-resize2 10s infinite alternate both;
+ -ms-animation: box-resize2 10s infinite alternate both;
+ -o-animation: box-resize2 10s infinite alternate both;
}
.ani div.a3 b {
- -webkit-animation: box-resize3 10s infinite;
- -moz-animation: box-resize3 10s infinite;
- -ms-animation: box-resize3 10s infinite;
- -o-animation: box-resize3 10s infinite;
+ -webkit-animation: box-resize3 10s infinite alternate both;
+ -moz-animation: box-resize3 10s infinite alternate both;
+ -ms-animation: box-resize3 10s infinite alternate both;
+ -o-animation: box-resize3 10s infinite alternate both;
}
.ani div.a4 b {
- -webkit-animation: box-resize4 10s infinite;
- -moz-animation: box-resize4 10s infinite;
- -ms-animation: box-resize4 10s infinite;
- -o-animation: box-resize4 10s infinite;
-
+ -webkit-animation: box-resize4 10s infinite alternate both;
+ -moz-animation: box-resize4 10s infinite alternate both;
+ -ms-animation: box-resize4 10s infinite alternate both;
+ -o-animation: box-resize4 10s infinite alternate both;
}
.ani div.a5 b {
- -webkit-animation: box-resize5 10s infinite;
- -moz-animation: box-resize5 10s infinite;
- -ms-animation: box-resize5 10s infinite;
- -o-animation: box-resize5 10s infinite;
+ -webkit-animation: box-resize5 10s infinite alternate both;
+ -moz-animation: box-resize5 10s infinite alternate both;
+ -ms-animation: box-resize5 10s infinite alternate both;
+ -o-animation: box-resize5 10s infinite alternate both;
}
.ani div.a6 b {
- -webkit-animation: box-resize6 10s infinite;
- -moz-animation: box-resize6 10s infinite;
- -ms-animation: box-resize6 10s infinite;
- -o-animation: box-resize6 10s infinite;
+ -webkit-animation: box-resize6 10s infinite alternate both;
+ -moz-animation: box-resize6 10s infinite alternate both;
+ -ms-animation: box-resize6 10s infinite alternate both;
+ -o-animation: box-resize6 10s infinite alternate both;
}
.ani div.a7 b {
- -webkit-animation: box-resize7 10s infinite;
- -moz-animation: box-resize7 10s infinite;
- -ms-animation: box-resize7 10s infinite;
- -o-animation: box-resize7 10s infinite;
+ -webkit-animation: box-resize7 10s infinite alternate both;
+ -moz-animation: box-resize7 10s infinite alternate both;
+ -ms-animation: box-resize7 10s infinite alternate both;
+ -o-animation: box-resize7 10s infinite alternate both;
}
.ani div.a8 b {
- -webkit-animation: box-resize8 10s infinite;
- -moz-animation: box-resize8 10s infinite;
- -ms-animation: box-resize8 10s infinite;
- -o-animation: box-resize8 10s infinite;
+ -webkit-animation: box-resize8 10s infinite alternate both;
+ -moz-animation: box-resize8 10s infinite alternate both;
+ -ms-animation: box-resize8 10s infinite alternate both;
+ -o-animation: box-resize8 10s infinite alternate both;
}
.ani div.a9 b {
- -webkit-animation: box-resize9 10s infinite;
- -moz-animation: box-resize9 10s infinite;
- -ms-animation: box-resize9 10s infinite;
- -o-animation: box-resize9 10s infinite;
+ -webkit-animation: box-resize9 10s infinite alternate both;
+ -moz-animation: box-resize9 10s infinite alternate both;
+ -ms-animation: box-resize9 10s infinite alternate both;
+ -o-animation: box-resize9 10s infinite alternate both;
}
.ani div.a10 b {
- -webkit-animation: box-resize10 10s infinite;
- -moz-animation: box-resize10 10s infinite;
- -ms-animation: box-resize10 10s infinite;
- -o-animation: box-resize10 10s infinite;
+ -webkit-animation: box-resize10 10s infinite alternate both;
+ -moz-animation: box-resize10 10s infinite alternate both;
+ -ms-animation: box-resize10 10s infinite alternate both;
+ -o-animation: box-resize10 10s infinite alternate both;
}
/*Fluid Animation*/
@@ -138,7 +132,7 @@
}
@-webkit-keyframes box-resize4 {
- 0% { top: 31%; right: 35%; bottom: 31%; left: 35%; }
+ 0% { top: 31%; right: 35%; bottom: 31%; left: 35%; }
50% { top: 19.2%; right: 29.333%; bottom: 19.2%; left: 29.333%; }
100% { top: 14.7%; right: 13%; bottom: 14.7%; left: 13%; }
}

0 comments on commit 93953fb

Please sign in to comment.