MyBB Community Forums

So here's a simple effect that is very cool! what do you think? 

anyways let's begin

~ GO TO  Admin CP > Templates & Styles > Templates > Your Template > PostBIT Templates > Postbit_avatar

Search for this  >

<div class="blur img"><a href="{$post['profilelink_plain']}"> 

And add this code near that

<div class="bw pic">
<style>
/*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%);
}
</style>

Thats it


Some Screenshots


Normal                          On Hover

[attachment=36200]           [attachment=36201]

Look's cool thanks

(2016-04-29, 10:00 AM)Donald_Duck Wrote: [ -> ]any snapshot or live url to above effect ! thanks

Done!

Simple but Nice effect bro
Good job !

Your CSS should go in the header_include template, but other than that it looks cool.

(2016-05-02, 07:59 PM)laie_techie Wrote: [ -> ]Your CSS should go in the header_include template, but other than that it looks cool.

Well it should go in global.css but i made things easier 

shouldn't this be in tutorials not mycode?

nice article tho.