Skip to content

Instantly share code, notes, and snippets.

@LeaVerou
Created April 20, 2012 12:58
Show Gist options
  • Save LeaVerou/2428309 to your computer and use it in GitHub Desktop.
Save LeaVerou/2428309 to your computer and use it in GitHub Desktop.
Image interpolation demo
/* Image interpolation demo
WebKit-only at the time (April 2012)
*/
@keyframes browsers {
20% { background-image: url('http://lea.verou.me/css-4d/img/chrome-logo.png'); }
40% { background-image: url('http://lea.verou.me/css-4d/img/safari-logo.png'); }
60% { background-image: url('http://lea.verou.me/css-4d/img/opera-logo.png'); }
80% { background-image: url('http://lea.verou.me/css-4d/img/ie-logo.png'); }
}
html {
background: url('http://lea.verou.me/css-4d/img/firefox-logo.png') center;
animation: browsers 5s infinite;
}
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment