Divisor

Éste sitio web usa cookies, puedes ver la política de cookies, Aquí. ⤵ ⤵


Efecto en imágenes push button






Este truco que os explico a continuación es de lo más sencillo de aplicar, es un efecto que seguramente habréis visto en algunos lugares, es un efecto que al pasar el mouse o el ratón por encima de una imagen, hace el efecto de hundimiento, y también cuando se hace clic encima de una imagen, botón, o icono. Sigue ahora a continuación los detalles para aplicarlo o añadirlo a tu blog, entra primero en Plantilla> Edición HTML> y antes de ]]></b:skin> añades el siguiente CSS:

.post img:hover {
position: relative;
top: 1px;
left: 1px;
}

Si deseas que el efecto pushbutton se aplique a todas las imágenes del blog, entonces pegamos este código en lugar del anterior código, éste:

img:hover {
position: relative;
top: 1px;
left: 1px;
}

Si quisieras que el efecto sólo se aplique a las imágenes que tú elijas, entonces omitimos esos demás códigos de antes y pegamos este:

.pushbutton:hover {
position: relative;
top: 1px;
left: 1px;
}

Y luego cuando quieras que una imagen tenga el efecto pushbutton usas este código qué visualizas a continuación, cada vez que quieras usarlo:

<img class="pushbutton" src="URL de la imagen" />

Sólo cambia la URL de la imagen y listo. Esa imagen tendrá el efecto pero las demás no. Puedes ver un ejemplo del efecto a continuación, en el siguiente botón.







Aizum Blog, viernes, septiembre 14, 2012


Divisor Star

✏ Buscador!

En las redes ⤵

✏ Vídeos!

 

Publicidad!

Subir hacia arriba ▲ Modificated & Designed by Iván Dangerfield © 2014. Converted by Bloggertheme9