Codly

html <div class="ifoclick animated"><img src="/pic/info.png" alt="info"/></div> css
.animated {
animation:myfirst 3s;
-moz-animation:myfirst 3s; /* Firefox */
-webkit-animation:myfirst 3s; /* Safari и Chrome */
-o-animation:myfirst 3s; /* Opera */
}
@-webkit-keyframes myfirst
{
0%  {left:0px; bottom:0px;}
5%  {left:0px; bottom:3px;}
10% {left:0px; bottom:6px;}
15% {left:0px; bottom:9px;}
20% {left:0px; bottom:6px;}
25% {left:0px; bottom:3px;}
30% {left:0px; bottom:0px;}
35% {left:0px; bottom:3px;}
40% {left:0px; bottom:6px;}
45% {left:0px; bottom:9px;}
50% {left:0px; bottom:6px;}
55% {left:0px; bottom:3px;}
60% {left:0px; bottom:0px;}
65% {left:0px; bottom:3px;}
70% {left:0px; bottom:6px;}
75% {left:0px; bottom:9px;}
80% {left:0px; bottom:6px;}
85% {left:0px; bottom:3px;}
90% {left:0px; bottom:0px;}
95% {left:0px; bottom:0px;}
100%{left:0px; bottom:0px;}
}
@-moz-keyframes myfirst /* Firefox */
{
0%  {left:0px; bottom:0px;}
5%  {left:0px; bottom:3px;}
10% {left:0px; bottom:6px;}
15% {left:0px; bottom:9px;}
20% {left:0px; bottom:6px;}
25% {left:0px; bottom:3px;}
30% {left:0px; bottom:0px;}
35% {left:0px; bottom:3px;}
40% {left:0px; bottom:6px;}
45% {left:0px; bottom:9px;}
50% {left:0px; bottom:6px;}
55% {left:0px; bottom:3px;}
60% {left:0px; bottom:0px;}
65% {left:0px; bottom:3px;}
70% {left:0px; bottom:6px;}
75% {left:0px; bottom:9px;}
80% {left:0px; bottom:6px;}
85% {left:0px; bottom:3px;}
90% {left:0px; bottom:0px;}
95% {left:0px; bottom:0px;}
100%{left:0px; bottom:0px;}
}