Skip to content

Instantly share code, notes, and snippets.

@malachi358
Last active December 17, 2015 18:49
Show Gist options
  • Save malachi358/5655782 to your computer and use it in GitHub Desktop.
Save malachi358/5655782 to your computer and use it in GitHub Desktop.
CSS3 animate background color infinite loop :)
body, #logo h1 a, ul#menu li.on {background-color: #39f !important;}
@-webkit-keyframes colours {
0% {background-color: #39f;}
15% {background-color: #8bc5d1;}
30% {background-color: #f8cb4a;}
45% {background-color: #95b850;}
60% {background-color: #944893;}
75% {background-color: #c71f00;}
90% {background-color: #bdb280;}
100% {background-color: #39f;}
}
body, #logo h1 a, ul#menu li.on {
-webkit-animation-direction: normal;
-webkit-animation-duration: 60s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-name: colours;
-webkit-animation-timing-function: ease;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment