Loading class
Append a class .loading
to your element.
.any-element .loading
CSS for Background and Icon.
.loading { width: 100%; height: 100%; left: 0; top: 0; position: absolute; background: black; font-size: 20px; color: #antiquewhite; z-index: 99999; @include -opacity(0.8); &:after { content: "\f110"; left: 50%; top: 50%; position: absolute; font-family: $font-awesome; animation: infinite-spin 2s linear infinite; -o-animation: infinite-spin 2s linear infinite; -ms-animation: infinite-spin 2s linear infinite; -moz-animation: infinite-spin 2s linear infinite; -webkit-animation: infinite-spin 2s linear infinite; } } @-moz-keyframes infinite-spin { from { -moz-transform: translate(-50%, -50%) rotate(0deg); } to { -moz-transform: translate(-50%, -50%) rotate(360deg); } } @-webkit-keyframes infinite-spin { from { -webkit-transform: translate(-50%, -50%) rotate(0deg); } to { -webkit-transform: translate(-50%, -50%) rotate(360deg); } } @keyframes infinite-spin { from {transform: translate(-50%, -50%) rotate(0deg);} to {transform: translate(-50%, -50%) rotate(360deg);} }