Truco HTML - Al Pasar el Puntero Sobre una Imagen

Este truco HTML permite que al pasar el puntero del mouse sobre la una imagen, esta última cambie por otra. Es un buen truco para hacer menús o colocar efectos a imágenes especiales de nuestro blog (iconos de descarga, suscripción, etc) por ejemplo:

---

4DAkfHScnFc8KD7jgTSvtKdX2FuAy47Ufob-I4ccz8ttfC_T6qqa-wMzmolZv40/s320/Imagen1.png.gif'" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZxtOgUtuKOaZ2_y2Q_XvT4lvRIevE7nxMQuIXHosBeWNuug8o3aCHCCE96nh3iy0BVIXJrlKR99uuO6LPUlkeSioK_ptZiFNL7akdESxIf-2LcaRt6E6J0-1pTfLQMaSUlb67eQBIx937/s320/Imagen2.png.gif'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZdrkliAakdofarEp727u2MMj2hp5dCd16oXEARLw9iBM8flreCEG-hZib2GRczXXC2ylEQ3sRJtT 4DAkfHScnFc8KD7jgTSvtKdX2FuAy47Ufob-I4ccz8ttfC_T6qqa-wMzmolZv40/s320/Imagen1.png.gif" width="250">

---

Opción 1: Efecto

Código

<img src="Imagen Estándar" alt="Premium" onmouseover="this.src='Imagen que cambia'" onmouseout="this.src='Imagen Estándar'" height="Alto de a Imagen" width="Ancho de la Imagen">

Opción 2: Efecto + Link

Código

<a href="Enlace"><img src="Imagen Estándar" alt="Premium" onmouseover="this.src='Imagen que cambia'" onmouseout="this.src='Imagen Estándar'" height="Alto de la imagen" width="Ancho de la Imagen"></a>

---

Mostrar Palabras Claves de esta Entrada

efectos de las imágenes, trucos htmlo, trucos html de imágenes, imagen escondida que aparece al pasar el mouse, imágenes aleatorias, truco html para hacer menus minimalistas, efecto en las imágenes, premium, coloco una imagen se oculta y aparece otra al alejar el mouse se quita y aperece el mejor truco para imágenes de nuestro blog, crear un boton animado, crear animaciones gif con truco html, imagen personalizada, decoración de imágenes