<div class="loader">Loading...</div>
@keyframes loader {
	to { background-position: -800px 0; }
}

.loader {
	width: 100px; 
  height: 100px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
	text-indent: 999px; 
  overflow: hidden;
	background: url(https://www.w3cplus.com/sites/default/files/blogs/2015/1507/loader.png) 0 0;
	animation: loader 1s infinite linear;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.