Skip to content

Instantly share code, notes, and snippets.

@tylergaw

tylergaw/dabblet.css

Created April 21, 2012 14:48
Show Gist options
  • Save tylergaw/2437501 to your computer and use it in GitHub Desktop.
Save tylergaw/2437501 to your computer and use it in GitHub Desktop.
Download ZIP
Image interpolation - Mugshots
Raw
dabblet.css
/* Image interpolation - Mugshots */
/* Original demo: http://dabblet.com/gist/2428309 */
@keyframes mugs {
from, to { background-image: url('http://florida.arrests.org/mugs/Marion/2012/1200017953.jpg'); }
5% { background-image: url('http://florida.arrests.org/mugs/Broward/581200316.jpg'); }
10% { background-image: url('http://florida.arrests.org/mugs/Pasco/000174499.jpg'); }
15% { background-image: url('http://florida.arrests.org/mugs/Pasco/000174502.jpg'); }
20% { background-image: url('http://florida.arrests.org/mugs/Broward/561200345.jpg'); }
25% { background-image: url('http://florida.arrests.org/mugs/Marion/2012/1200017960.jpg'); }
30% { background-image: url('http://florida.arrests.org/mugs/Alachua/ASO12JBN003773.jpg'); }
35% { background-image: url('http://florida.arrests.org/mugs/Marion/2012/1200017962.jpg'); }
40% { background-image: url('http://florida.arrests.org/mugs/Alachua/ASO12JBN003772.jpg'); }
45% { background-image: url('http://florida.arrests.org/mugs/Brevard/12_04_21_327212.jpg'); }
50% { background-image: url('http://florida.arrests.org/mugs/Seminole/2012/201200004861.jpg'); }
55% { background-image: url('http://florida.arrests.org/mugs/Pasco/000174504.jpg'); }
60% { background-image: url('http://florida.arrests.org/mugs/Alachua/ASO12JBN003769.jpg'); }
65% { background-image: url('http://florida.arrests.org/mugs/Marion/2012/1200017956.jpg'); }
70% { background-image: url('http://florida.arrests.org/mugs/Seminole/2012/201200004859.jpg'); }
75% { background-image: url('http://florida.arrests.org/mugs/Brevard/12_04_21_298206.jpg'); }
80% { background-image: url('http://florida.arrests.org/mugs/Seminole/2012/201200004865.jpg'); }
85% { background-image: url('http://florida.arrests.org/mugs/Brevard/12_04_21_327214.jpg'); }
90% { background-image: url('http://florida.arrests.org/mugs/Marion/2012/1200017964.jpg'); }
95% { background-image: url('http://florida.arrests.org/mugs/Alachua/ASO12JBN003777.jpg'); }
}
div {
animation: mugs 8s infinite;
background-position: center top;
background-repeat: no-repeat;
background-size: 610px 100%;
border: 2px solid #ccc;
margin: 0 auto;
overflow: hidden;
height: 595px;
width: 450px;
}
Raw
settings.json
{"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