Bustify es un Javascript creado por Matthew Lein que 'rompe' cualquier imagen en una serie de cuadros. Es decir, que al pasar el cursor del raton sobre una imagen con esta clase, se desmenuza en cuadritos como si fuera un puzzle y luego se vuelve a recomponer automaticamente. Si ademas hacemos click sobre ella, la imagen 'explota' entera en muchos trozos, pero despues vuelve a su estado normal. Sin duda es un original efecto que podemos aplicar a nuestro blog o web y darle el uso que mejor nos convenga. Pasa el raton y haz click sobre esta imagen para ver los efectos:
Para poner este efecto, lo primero que tienes que añadir son los codigos Javascript en la plantilla antes de </head>. Yo lo tengo alojado en un servidor, pero si lo quieres descargar y alojarlo tu mismo/a, puedes hacerlo aqui.
<script type="text/javascript" src="http://hostredeando.ucoz.es/js/bustify.js"></script>
<script type="text/javascript">
document.getElementById('rompeimagen').bustify({
width : 50,
height: 50,
intensity: 1,
perspective: '300px'
})
</script>
<script type="text/javascript">
document.getElementById('rompeimagen').bustify({
width : 50,
height: 50,
intensity: 1,
perspective: '300px'
})
</script>
Ahora, para mostrar la imagen con este 'rompedor' efecto, añades el siguiente codigo, sustituyendo lo que esta en color rojo por la url de la imagen que quieras poner.
<img src="URL DE LA IMAGEN" id="rompeimagen">
