Skip to content

Instantly share code, notes, and snippets.

@krizpoon
Created May 27, 2015 03:32
Show Gist options
  • Save krizpoon/1ba56f0f77bb9a1ee302 to your computer and use it in GitHub Desktop.
Save krizpoon/1ba56f0f77bb9a1ee302 to your computer and use it in GitHub Desktop.
Infinite rotation by CSS. Useful for loading spinners.
@keyframes rotating
{
from
{
transform: rotate(0deg);
-o-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
to
{
transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}
}
@-webkit-keyframes rotating
{
from
{
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
to
{
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}
}
.rotating
{
-webkit-animation: rotating 1s linear infinite;
-moz-animation: rotating 1s linear infinite;
-ms-animation: rotating 1s linear infinite;
-o-animation: rotating 1s linear infinite;
animation: rotating 1s linear infinite;
}
@LuisMlopez
Copy link

Works perfectly. Thank you so much!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment