See the Code - See it Full Page - See Details
A 3D Zoetrope is a play on the classic Zoetrope optical toy, where instead of a combination of barriers and slits to trick the brain into seeing frames of animation, a strobe light effect presents the framing. One of the more impressive (and big) modern versions of this is [Disney's Toy Story Zoetrope](https://youtu.be/RjSxrVXsfVM?t=1m20s). Based on the alignment of the frames, a strobe light, and a very fast spin in one direction can trigger an animation that potentially feels like it is moving in the opposite direction of the spin. Here we are actually not using a strobe but playing to the limitation of the web to max out (currently, mostly) at 60 frames per second. If you are in a browser that supports the Web Animations API (as of 8/2018 that's Firefox, Opera, Chrome, and Safari Technology Preview) you can slow down the animation to 1/40th the original to see what it looks like at a slow spin vs a spin that is so fast that the browser effectively shows each frame individually in the same places repeatedly.
This Pen uses: HTML, CSS, JavaScript, and