Again, I’ve seen it somewhere on the internet and recreated it. This one uses jQuery, although I plan to rewrite it to vanilla JavaScript.
It switches between two sides of the cube, every time you hover. Depending from which side cursor entered the cube, it will rotate in opposite direction. It is fully responsive, and on touch devices, direction depends of where you tap.
Cube side is a regular div, and you can put any type of content in it.
Works on every modern browser, but on IE it falls back to fade effect. Thing is that Internet Explorers do not support transform-style: preserve-3d property. More on MDN.
Check the demo. Documentation is on the same page.
Grab the code on GitHub.
Warning: Every person I introduced to this played with it for ages :)
No comments, be the first to comment