JSFiddle - React, Tailwind, and code Playground
by Craig Haywood
HTML
<p id="arrow">
$30 Discount Coupon: <span style="color: #f9e80d">30TEMPORARY</span></p>
</div>
CSS
@-webkit-keyframes arrow-jump {
0% { opacity: 0;}
100% { opacity: 1;
-webkit-transform: translatex(10px);
-moz-transform: translatex(10px);
-0-transform: translatex(10px);
transform: translatex(10px);
}
}
#arrow {
-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+ */
}