Animacja CSS źle działa

Question

Witam. 

Chciałem animować strzałkę, aby odbijała się - efekt bounce, lecz wychodzi mi zupełnie coś innego. Zachowuje się jakby się pomniejszała. 

Strona - sekcja header - strzałka w dół

Kod http://codepen.io/dodozhang21/pen/siKtp/

Przepisałem 1:1, a u mnie animacja zachowuje się dziwnie.

Pomożecie?

Answer 1

A ma kolega zainstalowanego compassa? :p

Answer 2

Jeżeli chodzi o animacje znacznika "header .header-bg i" to zrobiłeś to źle, bo zmieniłeś tylko wartość top. Da się to zrobić jedynie przez keyframes. Możesz użyć gotowca z http://l-lin.github.io/font-awesome-animation/. Tylko nie ładuj wszystkich animacji ;(

Answer 3

Witam. Prosty generator animacji. Animacje css

Żeby się powtarzała trzeba jeszcze dodać

animation-iteration-count:infinite;