Skip to content

Instantly share code, notes, and snippets.

@agaase
Last active July 4, 2021 20:31
Show Gist options
  • Save agaase/6659966 to your computer and use it in GitHub Desktop.
Save agaase/6659966 to your computer and use it in GitHub Desktop.
CSS Loader
Loading .. <span class="cssloader"/>
.cssloader{
height:25px;
width:25px;
border:7px solid rgba(0,174,239,.15);
/*border-left:0px solid black
*/border-radius:100%;
-webkit-animation:rotation 1.5s linear infinite;
position:absolute;
}
.cssloader:before{
content:"";
height:100%;
width:100%;
top:-5px;
left:-5px;
border-top:5px solid rgba(0,174,239,.8);
border-left:5px solid transparent;
border-bottom:5px solid transparent;
border-right:5px solid transparent;
position:absolute;
border-radius:100%;
display:block;;
}
@-webkit-keyframes rotation{
0%{-webkit-transform:rotate(-360deg);
}
50%{-webkit-transform:rotate(0deg);}
100%{-webkit-transform:rotate(360deg);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment