Cada dÃa van apareciendo nuevas funcionalidades basadas en jQuery, algunas muy útiles y otras, como esta, no tanto, pero por lo curiosa que es lo muestro. Como reza en el titulo del post, con esta librerÃa podremos hacer un puzzle con una imagen que le demos. Aquà la demo para ver de lo que hablo.
Para implementarlo primero creamos una carpeta (jQuery Puzzle por ejemplo) y descargamos las dos librerÃas javascrip necesarias, 1 y 2 (usar la opción picar botón derecho sobre el enlace y “guardar enlace comoâ€). Los metemos en la carpeta. Ahora creamos un .html, lo guardamos en la misma carpeta con el nombre que queramos (en mi caso jQueryPuzzle).
Abrimos de nuevo nuestro .html y empezamos a editarlo, primero llamamos a las dos librerÃas y la estructura en javascript necesaria entre head y /head:
[html]
[/html]
Seguido entre body /body creamos la estructura html, hacemos un div al que le pasamos la clase puzzle para que llame a la función javascript que hemos creado antes. Dentro de este div llamamos a la imagen con la que se hará el puzzle:
[html]
[/html]
Listo. Como decÃa antes, el uso de esto pues es más bien poco, pero nuca se sabe…
Enlace: jQuery Demo: Creating A Sliding Image Puzzle Plug-In