Inducion a nuevas tecnologias
¿Quieres reaccionar a este mensaje? Regístrate en el foro con unos pocos clics o inicia sesión para continuar.

Iconos sociales con animacion hover oblicua

Ir abajo

Iconos sociales con animacion hover oblicua Empty Iconos sociales con animacion hover oblicua

Mensaje por Diego Trujillo Miér Feb 20, 2013 9:26 am

Utilizando las posibilidades que nos ofrece el CSS3, he diseñado estos geniales iconos sociales. No existe ninguna imagen en su realizacion, para los logos he utilizado un tipo de fuente especial llamada fontawesome. Les he dado forma circular y un fondo degradado utilizando la propiedad linear-gradient, dandoles asi un toque mas elegante. Al pasar el cursor sobre ellos, cambia el color del fondo y de la fuente, produciendo una animacion de abajo a arriba en modo oblicuo. Esto se consigue usando la propiedad transition y con algunas lineas de codigo de estilo mas. Si te gustan y los quieres poner en tu blog o web, elige el modelo que mas te guste y copia el codigo correspondiente, sustituyendo el texto en color rojo por las direcciones url de tus redes sociales y la de tu feed RSS. Very Happy
[img]Iconos sociales con animacion hover oblicua Iconos10[/img]

(NOTA: Este efecto oblicuo se puede apreciar perfectamente en el navegador Firefox. En otros como Chrome, la animacion se vera de otra manera, pero de todos modos quedara muy bien.) Smile
Diego Trujillo
Diego Trujillo
Admin

Mensajes : 5
Fecha de inscripción : 19/02/2013
Edad : 31
Localización : Girardot Cund.

https://diegotecno.activo.mx

Volver arriba Ir abajo

Volver arriba


 
Permisos de este foro:
No puedes responder a temas en este foro.