http://jsfiddle.net/u7vXT/
<div id="container">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>
.box {
position: relative;
float:left;
background:#f00;
width:50px;
height:50px;
margin-right:5px;
}
.box.animated {
animation: bounce 1s;
}
@keyframes bounce {
0% {
top: 0;
animation-timing-function: ease-out;
}
17% {
top: 15px;
animation-timing-function: ease-in;
}
34% {
top: 0;
animation-timing-function: ease-out;
}
51% {
top: 8px;
animation-timing-function: ease-in;
}
68% {
top: 0px;
}
85% {
top: 3px;
animation-timing-function: ease-in;
}
100% {
top: 0;
}
}