Sombreado de imágenes al pasar el ratón: añade un efecto visual a tus fotografías

  • Autor Autor Qalpha
  • Fecha de inicio Fecha de inicio
Q

Qalpha

Redactor
No recomendado
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Bueno aburrido en casa, me puse a probar y bueno consegui, que al pasar el raton sobre la imagen se sombree, y viceversa 🙂


Aquí os dejo el código para que al pasar el raton se sombree:
Insertar CODE, HTML o PHP:
			img {
			opacity: 1.0;
			-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
			filter: alpha(opacity = 100);
			}
                                               img:hover {
			opacity: 0.7;
			-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 70);
			filter: alpha(opacity = 70);
			transition-duration: 0.5s;
			-moz-transition-duration: 0.5s;
			-webkit-transition-duration: 0.5s;
			-o-transition-duration: 0.5s;
			}

Y aquí os dejo que este sombreada y al pasar el raton no:
Insertar CODE, HTML o PHP:
                                               img {
			opacity: 0.7;
			-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 70);
			filter: alpha(opacity = 70);
			transition-duration: 0.5s;
			-moz-transition-duration: 0.5s;
			-webkit-transition-duration: 0.5s;
			-o-transition-duration: 0.5s;
			}
			
			img:hover {
			opacity: 1.0;
			-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
			filter: alpha(opacity = 100);
			}

Las etiquetas las cambias a tu gusto. Si necesitas ayuda, Comenta en el post 😉
 
Gran aporte, puede que lo use a futuro, gracias :encouragement:
 
Gracias, seguire posteando cosas en CSS, PHP y Demas 😛7:
 
Si bueno con el hover se pueden hacer efectos bastante llamativos 🙂
 
Existirá algo similar en Blogger?, necesito algo así. Gracias por el código.
 
algo básico, pero gracias por compartir :encouragement:.
 
Gracias para por compartir me servirá muchisimo 😛irate:
 
Existirá algo similar en Blogger?, necesito algo así. Gracias por el código.

Las plantillas de blogger contienen css, o sea que puedes aplicar este efecto si lo deseas.
:encouragement:
 
Gracias por el aporte 🙂 me gusta ese efecto cuando pasa por el logo 😛
 
Gracias por compartir! :topsy_turvy:
 
Muy bueno!! Gracias por compartir, lo estaré aplicando 🙂
 
Gracias A todos, cualquier cosa, que necesiteis, MP!!
 
Buen aporte, si podés, subite un demo así los users pueden ver 😀
 
voy a probarlo
 
Estas son el tipo de cosas que me interesan para el curso, sencillas y útiles.

¡Gracias! 🙂
 
gracias por el aporte 😀
 
Atrás
Arriba