Con este efecto, las imágenes de tu blog se ampliarán, de manera deslizante, a su tamaño original.
En script lo proporciona la librería Dynamic Drive.
Puedes descargar el script desde aquí e instalarlo en tu plantilla o utilizar el que yo alojé en Google sites.
Ver ejemplo online
Busca la etiqueta </head> y agrega el siguiente script encima:
<script src='http://sites.google.com/site/scriptsbalcon/b/balcon-expando.js' type='text/javascript'>
</script>
Ahora busca la etiqueta ]]></b:skin> y agrega este bloque para dar un poco de estilo a las imágenes:
img.expando{
border: 1px solid #cccccc;
background: transparent;
padding:2px;
vertical-align: top;
}
Para cambiar la decoración de las imágenes...
border: 1px solid #cccccc; Es el borde. Puedes cambiar el grosor (1px), el estilo de borde (solid. Consulta esta entrada para ver más modelos) y el color (#cccccc).
background: transparent; Es el fondo. Está en transparente. Para aplicarle un color de fondo, busca el código en la tabla de colores e inclúyelo en la línea, sustituyendo la palabra transparent.
Por último guarda cambios.
Cada vez que desees aplicar el efecto, debes incluir la imagen con esta línea:
<img class="expando" src="URL DE TU IMAGEN" width="150" height="150"/>
Sustituye URL DE TU IMAGEN por la dirección de tu imagen, icono o logo.
Ten en cuenta que debes personalizar el grosor (width="150") y la longitud (height="150") de la imagen que se mostrará "encojida".
Para incluir el efecto en una imagen que ya tengas alojada, agrega la clase: class="expando" justo antes del src (que indica la dirección de la imagen).
Esta muy chulo oye...
Lo probaré a ver que tal.
Saludos!!!
Que tal Jaime, unas preguntas, dices que hay que bajar el script, pero tu ya nos lo estás dando en esta entrada en cada paso de la explicacion. Por otro lado, como se comportaria el blog si la imagen es muy grande???? o sea, si la imagen se agranda mucho, que pasaria con todo el contenido de la web?? no se haria pedazos???? saludos.
La Trucoteca de Blogs, me alegra que te guste. ¡Ya me contarás! ☺.
Abel3D, no me refiero a que descarguéis el script, simplemente a que, si queréis, podeis utilizar el de Dynamic Drive (alojado en dicho sitio).
El script que yo alojé en Google Sites es el mismo que el de dicha librería, la única diferencia es el alojamiento.
En cuanto a lo que dices sobre las imágenes, es aconsejable que el ancho de éstas no supere el ancho del main-wrapper (zona de las entradas).
De esta forma, la imagen no se "ocultará" entre la sidebar y el resultado no provocará un desorden ;).
Este sí está bueno :) Gracias.
Yo, no hay de qué ;).