alloytouch
Version:
super tiny size touch and physical motion library for the web
15 lines (13 loc) • 1.47 kB
CSS
@-webkit-keyframes spinner-12{0%{-webkit-transform:rotate(0deg)}8.333333333333332%{-webkit-transform:rotate(30deg)}16.666666666666664%{-webkit-transform:rotate(60deg)}25%{-webkit-transform:rotate(90deg)}33.33333333333333%{-webkit-transform:rotate(120deg)}41.66666666666667%{-webkit-transform:rotate(150deg)}50%{-webkit-transform:rotate(180deg)}58.333333333333336%{-webkit-transform:rotate(210deg)}66.66666666666666%{-webkit-transform:rotate(240deg)}75%{-webkit-transform:rotate(270deg)}83.33333333333334%{-webkit-transform:rotate(300deg)}91.66666666666666%{-webkit-transform:rotate(330deg)}}
@keyframes spinner-12{0%{-webkit-transform:rotate(0deg)}8.333333333333332%{-webkit-transform:rotate(30deg)}16.666666666666664%{-webkit-transform:rotate(60deg)}25%{-webkit-transform:rotate(90deg)}33.33333333333333%{-webkit-transform:rotate(120deg)}41.66666666666667%{-webkit-transform:rotate(150deg)}50%{-webkit-transform:rotate(180deg)}58.333333333333336%{-webkit-transform:rotate(210deg)}66.66666666666666%{-webkit-transform:rotate(240deg)}75%{-webkit-transform:rotate(270deg)}83.33333333333334%{-webkit-transform:rotate(300deg)}91.66666666666666%{-webkit-transform:rotate(330deg)}}
.loading {
background-image: url(loading.png);
background-size: 20px 20px;
width: 20px;
height: 20px;
-webkit-animation: spinner-12 1.6s step-start infinite;
animation: spinner-12 1.6s step-start infinite;
display:inline-block;
position:relative;
top:5px;
}