Image Hover #1

Author : Nur Aisyah Time : 4:07 pm Comments : 0 ✿ Labels :

Assalamualaikum  >.<

Style 1 : Image hover terang 


Designer Template

  • Dashboard > Layout > Add Gadget > Html/JavaScript


  • Paste Code Ini ---- >



 <style>
    /* ----- Image opacity effect 2 ----- */
    .post a img {
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    -khtml-opacity: 0.5;
    }
    .post a:hover img {
    filter:alpha(opacity=100);
    -moz-opacity: 1.0;
    opacity: 1.0;
    -khtml-opacity: 1.0;
    }
    </style>



  • Save !



Clasicc Template and Blogskin

  • Dashboard > Template > Edit HTML


  • Ctrl F serentak cari code ini  --- > </style>



  • Then paste code ini di atas code tadi  ---->



/*------ IMAGE ANIMATION------*/
img, a img { border: 0px;  opacity: .75; filter: alpha(opacity=100); -o-transition: opacity 1.5s linear; -webkit-transition: opacity 1.5s linear; -moz-transition: opacity 1.5s linear; }
img:hover, a:hover img {opacity: 100; filter: alpha(opacity=100); -o-transition: opacity 1s linear; -webkit-transition: opacity .8s linear; -moz-transition: opacity 1.5s linear; }


  • Save Template !



Thanks . Wassalam >.<

0 Kawan Iesyah Comment(s) :

Post a Comment

ʕ•ᴥ•ʔ = Comment yang murni-II saje ya sayang ;)