mayo 06, 2016

Efecto blanco y negro al poner el cursor sobre la imágen


Hecha sobre Jehová tu carga, y Él te sustentará;
no dejará para siempre caído al justo.
Salmos 55:22

Holys mis panditas.. como han estado esas mariposillas bellas de este bloggy?
Yo espero que super mega bien por la gracia de Dios!!

Hoy les quiero compartir un efecto muy lindo, es un efecto para para imágenes.
Lo que hace este efecto es que al pasar el cursor sobre la imágen que contenga dicho efecto
esta cambiara a blanco y negro.

Este efecto no se visualizará en todas las imágenes de tu blog, solo se mostrará en la imágen especifica a la que tu le agregues dicho efecto. Lo cual viene muy bien para decorar nuestro sidebar.
Por ejemplo es un efecto maravillos para poner en la imagen que casi siempre ponemos en gadget de Bienvenida (el primer gadget en el sidebar del blog).
Esto es solo ejemplo para darte una idea. 

Bueno, bueno.. mis panditas chulas, paremos este mini conversao y comencemos con este maravilloso tuto.. tutorial!! ..Les parece? -Pués, let's go..

Como hoy no estoy por mucho explicar.. resumire todo el proceso..
Si ya has visto los tutos anteriores a este, sabrás entonces como hacerlo, porque en ellos
les explico detalladamente el proceso. Y me imagíno que ya tendrán una idea de como se hace.
En caso de no ser así, déjame tu duda aquí en los comentarios.. Tu solo grita fuerte y vendré corriendo ayudarte, vale!!

 Pega el siguiente CSS en tu plantilla:

.bw {-webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;-ms-transition: all 1s ease;transition: all 1s ease;}.bw:hover {-webkit-filter: grayscale(100%);}.pic {float: center;margin: 20px;overflow: hidden;}

Ahora donde quiera que se vea el efecto, debes agregar el siguiente codigo:

<div class="bw pic"><img src="URL DE TU IMÁGEN" alt="sea"></div>

Aquí te dejo un ejemplo de como se visualiza.
Tan solo pon el mouse encima de la siguiente imágen:

sea

Y si quieres que la imágen te quede centrada como esta,
solo debes agregar el codigo anterior dentro de la
siguiente etiqueta:
<center>AQUÍ EL CODIGO ANTERIOR</center>

Ya saben mis maripositas, si tienen dudas solo grita fuerte y vengo ayudarte.
Espero te haya gustado el tuto de hoy. Hasta una proxima entrada!!
Bendiciones!!



Briiz๑ Shokolattoza

Copyright ©2016 - Derechos Reservados
 SI COMPARTES EN TU BLOG ESTA O CUALQUIER ENTRADA DE MI BLOG
 RECUERDA ENTONCES DAR LOS CRÉDITOS CORRESPONDIENTES!!
 Y SI TE GUSTÓ ESTA PUBLICACIÓN, NO TE VAYAS PORFIS SIN COMENTAR!!
subir imagenes



Related Posts Plugin for WordPress, Blogger...

Emoticones para los Comentarios

:) :-) :)) =)) :( :-( :(( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ :-$ (b) (f) x-) (k) (h) (c) cheer


No hay comentarios. :

Publicar un comentario

๑ ALGUNOS PUNTOS A TENER EN CUENTA ๑
♣ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~♣
❤ Tus comentarios son Importantes para nosotros!
❤ Por tanto, procura que tu comentario sea de bendición para quien lo lea!
❤ Para compartir una IMAGEN debes utilizar : [img]URL de la imagen[/img]
❤ Para compartir un VIDEO debes utilizar : [video]URL del video[/video]
❤ Para compartir un ENLACE HAS CLIC JUSTO AQUI para ver como hacerlo.
❤ Para usar EMOTICONES escribe el signo que esta al aldo de la image que quieres utilizar.
❤ Si estas en desacuerdo con algo del blog, usa esta vía para informarnos :
❤ b.pinceladas@gmail.com, NO lo hagas publicamente en forma de respeto!
❤ Recuerda : Dile NO al PLAGIO, NO al COPY, NO al SPAM y se ORIGINAL!
❤ De antemano, GRACIAS por estar aquí! ..y NO te vayas sin comentar!
❤ Pues tus comentarios son caricias de Dios a mi alma!
❤ Y recuerda que si te gusta lo que hacemos, tan solo..:
❤ Comparte + Síguenos + Comenta!
❤ Observa + Procesa + Transforma + Crea + Y No Copies!

• Es una ilusion para mi que me visites, compartas y comentes! ∞Esto me motiva a seguir compartiendo con ustedes mas de lo que que aqui en Briiz, solemos compartir! ♥ Quiero que sepas, que tus comentarios siempre seran leidos y creeme que a la mayor brevedad posible los estare respondiendo, especialmente si son preguntas o dudas! Comentarios fuera de lugar °NO seran publicados, pero °SI eliminados! ¡Gracias por tus lindos comentarios! ツ °Honey kisses babyღ

Deferentemente, Briizɞ ..ToChocolatoza!
♥´¨)
¸.-´¸.-♥´¨) ¸.-♥¨)
(¸.-´ (¸.-` ♥ túMusa• ♥.-´¯`-.♥
Briizmarg•Designs ♥ Momentons Entre Lineas ©

๑ DISEÑANDO CON CREATIVIDAD ✿ PARA ILUSTRAR CON ORIGINALIDAD AL ESTILO BRIIZ๑

Welcome to my blog! ❤ Gracias x estar aqui.. No te vayas sin cometar las entradas que visites! ❤..UNETE a los Best Friends del Blog, y SUSCRIBETE AL FEED para recibir las ultimas actualizaciones! ❤..Anímate y comparte con tus amigos nuestras ilustraciones! ❤ Bendiciones ❤