CSS Keyframe Animations
yellowone.animate {
-webkit-animation-name: yellow_one;
-webkit-animation-duration: 13s;
-webkit-animation-timing-function: ease;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: normal;
-webkit-animation-delay: 0;
-webkit-animation-play-state: running;
-webkit-animation-fill-mode: forwards;
animation-name: yellow_one;
animation-duration: 13s;
animation-timing-function: ease;
animation-iteration-count: infinite;
animation-direction: normal;
animation-delay: 0;
animation-play-state: running;
animation-fill-mode: forwards;
}
@-webkit-keyframes yellow_one {
0% {
left:185px;
top:-15px;
}
6.6% {
left:260px;
top:20px;
}
13.2% {
left:285px;
top:85px;
}
19.8% {
left:260px;
top:150px;
}
26.4% {
left:185px;
top:185px;
}
33% {
left:115px;
top:220px;
}
39.6% {
left:85px;
top:285px;
}
46.2% {
left:115px;
top:350px;
}
52.8% {
left:185px;
top:385px;
}
59.4% {
left:260px;
top:350px;
}
66% {
left:285px;
top:285px;
}
72.6% {
left:260px;
top:220px;
}
79.2% {
left:115px;
top:150px;
}
85.8% {
left:85px;
top:85px;
}
92.4% {
left:115px;
top:20px;
}
100% {
left:185px;
top:-15px;
}
}
Written by Ollie
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Animations
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#