Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Stereoscopic 3D image
<h1>Simple 3D effect</h1>
<div class="flip"></div>
.flip{
background:url(http://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/Asiatic_hybrid_lilium_stereogram_flipped.jpg/800px-Asiatic_hybrid_lilium_stereogram_flipped.jpg);
animation:flip 250ms steps(1, end) infinite;
width:400px;
height:453px;
}
@keyframes flip{
0%{
background-position:0 0;
}
50%{
background-position:400px 0;
}
}
body{
font-family:Helvetica, sans-serif;
}
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.