-

18.02.2015

Efecto "Rotación" Fuente

HTML<div class="rotarY"><img style="border: 2px dotted #ccc; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; -webkit-box-shadow: #6d3112 3px 3px 9px; -moz-box-shadow: #6d3112 3px 3px 9px; box-shadow: #6d3112 3px 3px 11px;" src="https://lh5.googleusercontent.com/-yP5NBuXKVY4/VJGtQiSf3lI/AAAAAAABQsI/EXjzy2exPp0/w213-h300-no/1-213x300.gif" alt="" width="235" height="299" /></div>

CSS.rotarY{
 transform:rotateY(0deg);
 transition-duration: 2s;
 -webkit-transform:rotateY(0deg);
 -webkit-transition-duration: 2s;
 }
 .rotarY:hover{
 transform:rotateY(180deg);
 transition-duration: 2s;
 -webkit-transform:rotateY(100deg);
 -webkit-transition-duration: 2s;
 }