Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
HTML5: Loading circle
<!DOCTYPE html>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type='text/css'>
@-webkit-keyframes rotate {
from {
-webkit-transform: rotate(0deg);
to {
-webkit-transform: rotate(360deg);
#loading {
border: 1px solid #000;
border-right: 0;
border-bottom: 0;
-webkit-border-radius: 100px;
height: 100px;
width: 100px;
margin: 100px;
-webkit-transition: all 0.5s ease-in;
-webkit-animation-name: rotate;
-webkit-animation-duration: 1.0s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
<div id="loading"></div>

This comment has been minimized.

Copy link

vtellier commented Apr 20, 2016

Good idea.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.