JSFiddle - React, Tailwind, and code Playground
by Johan Pantzare
HTML
<img id="arrow" src="http://icons.veryicon.com/ico/System/iOS7%20Minimal/Arrows%20Forward.ico">
CSS
@-webkit-keyframes arrow-jump {
0% { opacity: 1;}
100% { opacity: 0;
-webkit-transform: translateX(30px);
-moz-transform: translateX(30px);
-0-transform: translateX(30px);
transform: translateX(30px);
}
}
#arrow {
height:50px;
-webkit-animation: arrow-jump 1s infinite; /* Safari 4+ */
-moz-animation: arrow-jump 1s infinite; /* Fx 5+ */
-o-animation: arrow-jump 1s infinite; /* Opera 12+ */
animation: arrow-jump 1s infinite; /* IE 10+, Fx 29+ */
}