CSS Animate Background Text

HTML
<div class="container"> <span>NIGHT SKY</span> </div>
CSS
@keyframes Animate{ from{ background-position: center 25%; } to{ background-position: center 50%; } } html, body { display: table; height: 100%; width: 100%; margin: 0; padding: 0; } .container { display: table-cell; text-align: center; vertical-align: middle; } .container span{ background-image: url(http://mixhdwallpapers.com/wp-content/uploads/2014/03/15.night_sky_hd.jpg); -webkit-text-fill-color: transparent; -webkit-background-clip: text; color: #000; padding-top: 20px; font-size: 170px; font-family: 'Helvetica',Arial, sans-serif; font-weight: bold; animation: Animate 3s ease forwards; }
JAVASCRIPT
Expand for more options Login