Páginas

lunes, 7 de enero de 2013

Efecto onmouseover: agrandar una imagen.

Este efecto consiste en que al pasar el ratón por un texto o una imagen, produzcan una respuesta como cambio de color o agrandar la letra o imagen.
Es muy útil sobre todo en textos con enlace o cuándo queremos agrandar una imagen.
Los pasos a seguir son los siguientes:
Tienes que subir la imagen a la nube, en este blog tienes algunos sitios dónde poder hacerlo de forma gratuita. Pero si quieres puedes utilizar una entrada de bloger, en la que subas una imagen desde tu ordenador. Una vez subida, copias el enlace que te ha generado, y guardas la entrada del blog en la que tienes la imagen como borrador.
Hasta aquí está claro. ahora solamente te queda copiar el siguiente código, y lo pegas en la entrada como html. Solo te queda modificar y poner la url de la imagen que habías guardado en la entrada como borrador.

<img src="URL-IMAGEN" onmouseover="this.width=400;this.height=300;" onmouseout="this.width=200;this.height=150;" width="200" height="150" />


3 comentarios:

  1. Lo acabo de probar y funciona, trataré de implementarlo en alguna imagen.
    Saludos

    ResponderEliminar
  2. Lo acabo de probar y publicar en mi blog, para ello he conseguido una modelo que pose para mi.
    Lo puedes ver en este enlace.
    Ya he visto que el efecto onMouseOver tiene más posibilidades, así que las iré explorando.
    Saludos

    ResponderEliminar