Hey babies! Tal como dije en el post anterior, me apetece mucho subir tutoriales, además de que tengo muchos por subir (al menos los que a mi me parecieron más interesantes), empezando por el de hoy, que es un mini tutorial sobre cómo hacer que una imagen, si ponemos el ratón encima, se transforme en otra.
1. Vamos a nuestro código y pegamos el siguiente código ANTES de ]]></b:skin>:
.imghover
{background: url('urlfotoprincipal'); width:anchofotopx; height:alturafotopx; -webkit-transition:0.9s;}
.imghover:hover {background:url('urlfotohover'); width:anchofotopx; height:alturafotopx; -webkit-transition:0.9s;}
Cambiamos la url a las de nuestras imágenes, además de la altura y anchura.
2. Ahora colocamos el siguiente código donde queramos que aparezcan las imágenes:
<div class="imghover"></div>
No hay comentarios:
Publicar un comentario
Hey! Si has llegado hasta aquí es porque has leído todo el post y si no, intenta hacerlo, tal vez haya escrito algo sobre mí, el blog o cualquier tema que a mi me parezca importante.
Aquí dejo algunos puntos a tener en cuenta a la hora de comentar:
★ Por favor, sé respetuoso/a.
★ Si tienes cualquier duda que no se pueda resolver por comentarios o cualquier pedido, hazlo en Contacto.
★ ¿Quieres afiliarte? Puedes dejar el link en la sección Afiliate.
★ ¡Gracias por visitar el blog!
Aquí dejo algunos Kaomojis por si quieres usarlos:
(* ^ ω ^) ☆ *:… o (≧ ▽ ≦) o…: * ☆ (o ^ ▽ ^ o) (‘. • ω •.`) (o · ω · o) (@ ^ – ^) ヽ (* · ω ·) ノヽ (o ^ – ^ o) ノ (^ 人 ^) (^ ▽ ^) (¯ ▽ ¯) (‘. • ᵕ •.`) (≧ ▽ ≦) / (♡ ˙)˙ ♡) (* ¯ ³ *) ♡ (* ♡ ∀ ♡) ♡ (¯ ▽ ¯) / ♡ (> ﹏ <) (; ⌣_⌣) (–_–) (╯_╰) (T_T) (╥ω╥) (O_O;) (⊙_⊙) (⌒ ▽ ⌒) (^ – ^ *) / (o’ω`o) ノ (✧∀✧) / (~ ▽ ¯) ~ (^ _ ^ ♪) (~ ˘ ▽ ˘) ~ (˘ ▽ ˘) っ (͡ ° ͜ʖ ͡ °)
O si estás usando Windows, usa la combinación de teclas Windows + . (punto) para otros símbolos y/o emojis.