Skip to content

Instantly share code, notes, and snippets.

@tjunussov
Created November 11, 2020 06:30
Show Gist options
  • Save tjunussov/006b130a6e5e24900276c4748ac5dad4 to your computer and use it in GitHub Desktop.
Save tjunussov/006b130a6e5e24900276c4748ac5dad4 to your computer and use it in GitHub Desktop.
Rotating circle before page loaded
<style>@keyframes lds-circle { 0%, 100% {animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);} 0% {transform: rotateY(0deg);} 50% {transform: rotateY(1800deg); animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1); } 100% {transform: rotateY(3600deg);}} </style>
<body class="bg-grey-2" ontouchstart="">
<div id="q-app"><div style="display: inline-block; transform: translateZ(1px); position: fixed; top: 50%; left: 50%; margin-left: -32px; margin-right: -32px;"><div style="display: inline-block; width: 32px; height: 32px; margin: 8px; border-radius: 50%; background: #054bb5;animation: lds-circle 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;"></div></div></div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment