22 May 2011
Smart3D, efecto jquery para hacer elementos 2d con profundidad
Smart 3D, es un efecto muy interesante ya que puedes generar profundidad 3D simulada con todas las capas que desees 2D, además este plugin es muy sencillo y casi no necesita edición.
Para lograr este efecto debes crear una lista con imágenes, estás se verán una delante de otra y al pasar encima con el mouse se generará el efecto de profundidad.
les dejo un Demo que eh preparado, el link del autor del plugin y los archivos adjuntos para descarga.
Demo:
Codigo:
Selec All Code:
1 2 3 4 5 6 7 8 9 | <script type="text/javascript"> $(document).ready(function() { $('#smartdemo').smart3d({ invertHorizontal: true, invertVertical: true }); }); </script> |
Selec All Code:
1 2 3 4 | <ul id="smartdemo"> <li><img src="img/s3d.jpg" alt="" /></li> <li><img src="img/s3d2.png" alt="" /></li> </ul> |
Selec All Code:
1 2 3 4 5 6 7 8 9 10 11 | #smartdemo { width: 600px; height: 450px; overflow: hidden; border:2px solid #444444; margin: 0; } #smartdemo li{ width: 800px; height: 600px; } |
