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.
Para poner este efecto, lo primero que tienes que añadir son los codigos Javascript en la plantilla antes de </head>.
Para instalarlo en vuestro Bloc solo tenéis que seguir estos pasos:
Un clic en “Plantilla”
Un clic en “Editar HTML”
Ahora se te abrirá el Editor HTML de tu plantilla
En este punto deberás presionar la tecla “Control” de tu teclado seguido de la tecla “F” para que aparezca el buscador integrado en la parte superior derecha de tu editor,
debes esperar unos segundos hasta que se muestre, aquí es donde tendrás que insertar el código para buscarlo e insertar los códigos correspondientes en el editor,
Busca el siguiente código
</head>
Ahora justo encima (ó antes) de esa etiqueta, pegamos lo siguiente:
<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>
Yo lo tengo alojado en un servidor, pero si lo quieres descargar y alojarlo tu mismo/a, puedes hacerlo aqui.:
hora, 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">
Data de la Publicación; 25-08-2019
Fuente; redeando
Publicado por;
0 comentarios