Skip to content

Instantly share code, notes, and snippets.

@tomax
Last active December 24, 2015 09:39
Show Gist options
  • Select an option

  • Save tomax/6778931 to your computer and use it in GitHub Desktop.

Select an option

Save tomax/6778931 to your computer and use it in GitHub Desktop.
CSS spinner (stollen from http://codepen.io/noeldelgado/pen/Bkzlu)
/**
* CSS spinner (stollen from http://codepen.io/noeldelgado/pen/Bkzlu)
*/
.vp-loader-popup .popupContent {
width: 30px;
height: 30px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -15px;
margin-left: -15px;
border: 3px solid #0D8189;
border-radius: 50%;
}
.vp-loader-popup .popupContent::before, .vp-loader-popup .popupContent::after {
content: "";
position: absolute;
display: block;
width: 3px;
background-color: #0D8189;
border-radius: 1.5px;
transform-origin: 50% 0%;
}
.vp-loader-popup .popupContent::before {
height: 9px;
left: 13.5px;
top: 50%;
animation: spin 2000ms linear infinite;
}
.vp-loader-popup .popupContent::after {
height: 12px;
left: 13.5px;
top: 50%;
animation: spin 500ms linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
<!-- content to be placed inside <body>…</body> -->
<div class="vp-loader-popup"><div class="popupContent"></div></div>
// alert('Hello world!');
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment