-

13.07.2015

Efecto "B&W"

HTML<div class="bw pic"><img style="border: 1px dotted #ff0000; -webkit-border-radius: 50px/10px; -moz-border-radius: 50px/10px; border-radius: 50px/10px; -webkit-box-shadow: #6d3112 3px 3px 6px; -moz-box-shadow: #6d3112 3px 3px 6px; box-shadow: #6d3112 3px 3px 11px;" src="https://lh4.googleusercontent.com/-C5t4usj-ojs/U9iwm29QqNI/AAAAAAAAvLs/ma7Xbri_qT8/w240-h320-no/1173124.gif" alt="" width="190" height="230" /></div>

CSS
/*B&W*/
.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%);
}