Ultimas entradas

COLOCAR DOS IMÀGENES EN UNO

By Blogs Famag - miércoles, enero 17, 2018

COLOCAR DOS IMÀGENES EN UNO



Hoy vamos a ahorrar sitio en una entrada o en tu pagina colocando 2 Imagenes en una, cuando abres la pagina te sale una y cuando pasa el maus por encima te sale la segunda imagen.

Han visto que hay imágenes que al poner el puntero del mouse sobre ellas cambian, como botones o logos, esto se realiza con un código básico para las imágenes en HTML, con el cual también podemos por ende mostrar dos imágenes diferentes. El código base es el siguiente:


<img src="URL Imagen que se visualiza" onmouseover="this.src='URL Imagen que cambia con Mouse';" onmouseout="this.src='URL Imagen que se visualiza';" />




Tamién se puede hacer con imágenes comunes, y además podemos redireccionarlas; le voy a agregar de una vez el código para que se abra en otra pestaña o ventana, también podemos definir su tamaño con las etiquetas width="200" y height="200" (opcional en caso de que las imagenes tengan diferentes medidas o sean muy grandes) el codigo quedaría así:



<a href="URL que redirecciona" target="_blank"><img src="URL Imagen que se visualiza" onmouseover="this.src='URL Imagen que cambia con Mouse';" onmouseout="this.src='URL Imagen que se visualiza';" width="200"  height="200" /></a>


Acordaros de cambiar el width="200"  height="200"  por el que le corresponda de las medidas que coloqueis de las Imagenes.



17-01-2018

Publicado por:    













  • Share:

You Might Also Like

0 comentarios