Bienvenido a VidaBlogger, un sitio dedicado a brindar Ayuda para Blogs.

Vas a poder encontrar trucos blogger, tutoriales y herramientas para blogs, aprenderás estrategias sobre SEO y posicionamiento web, y te daremos los mejores consejos para que lleves tu blog al máximo potencial!





4 may. 2010

Agrandar imagen con solo pasar el cursor



Otro truco para no poner imágenes grandes que ocupen mucho espacio en tu blog es añadir el efecto para que se amplíe al pasar el cursor por encima de esta.

Así permitirás a los visitantes de tu sitio puedan observar detalladamente las imágenes de tus post, sin tener que descargarlas al ordenado para ampliarlas, o que se habrá el archivo en otra ventana. Además este efecto es muy llamativo.
Puedes colocarlas en todos los post o también armar una combinación añadiéndole a algunos este efecto, otros con el que amplia las imágenes haciendo un clic sobre ellas, y los demás con imágenes comunes.

Para colocarlo simplemente tienes que copiar este código y pegarlo dentro de la entrada.

<img src="URL de la imagen" onmouseover="this.width=400;this.height=300;" onmouseout="this.width=100;this.height=80;" width="100" height="80" />

Las partes del código que debes remplazar son:

Url de la imagen: Con la imagen que elegiste para añadirle el efecto.

El primer width y height del codigo: Con las medidas que quieres que se amplié.

El segundo width y height : Por las medidas que desees que se reduzca.

Los ultimos width y height: Deben ser igual a las medidas anterior, este te indicara como se vera en la pagina.

Width: Es ancho.

Height: Es largo


Si te ha gustado este post, no dudes en suscribirte al feed RSS de VidaBlogger - Ayuda para Blogs! para recibir todos los días la últimas novedades - (¿Que es RSS?)

3 comentarios :

  1. Anónimo14/8/10 3:33

    gracias esta mejor tu codigo que los demas me gusto y no se amontona con una doble imagen
    gracias

    ResponderEliminar
  2. Genial!!! Muy bueno n.n muchas gracias por el aporte!
    Ok, me voy a suscribir

    ResponderEliminar
  3. perdona como se inserta este codigo en un wordpress con tema style?
    si no es mucho pedir.

    Muchas gracias

    ResponderEliminar

Lea las reglas:

Todos los comentarios serán leídos y moderados previamente.

Serán publicados aquellos comentarios que respeten las siguientes reglas:
- Su comentario debe estar relacionado al contenido del post.
- No se aceptan comentarios tipo SPAM.
- No incluya links No necesarios en el contenido de su comentario.
- Si quieres dejar la url de tu blog, hazlo utilizando la opción OpenID.
- La caja de comentarios no es el lugar para pedir intercambio de links (para ello ve a la página de contacto).
- Ofensan personales, amenazas o insultos NO serán permitidos.

OBS: Los comentarios de los lectores no reflejan las opiniones del blog.