Add Tilt Image Effect To Blogger (Blog trick)

Tilt image effect is an effect when you place your mouse pointer on the image, it will be shaking. Tilt image effect is really awesome effect only for blogger. There are many image effects for blogger and it is one of them. I already noticed many bloggers liked this effect. In the previous i posted about Image Shadow effect and Image Zoom Effect. It is also cool. You just have to see the demo, then decide.




Here is the demo. Place your mouse pointer on the below image to see the effect


View demo
  • Go To Blogger → Design → Edit HTML



  • Press CTRL + F To Find the follwing code




  • ]]></b:skin>
    
    Copy and Paste the below code just Above/Before ]]></b:skin>

    .post img {
    -webkit-transition:  -webkit-transform .15s linear;
    -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
    -moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
    padding: 5px 5px 5px 5px;
    -webkit-transform:  rotate(+2deg);
    -moz-transform: rotate(+2deg);
    }
    .post img:hover {
    -webkit-box-shadow:  0 3px 6px rgba(0,0,0,.5);
    -moz-box-shadow: 0 3px 6px rgba(0,0,0,.5);
    -webkit-transform:  rotate(-1deg);
    -moz-transform: rotate(-1deg);
    }


    Save the template and done
    Enjoyed the article ? Please take only 10 seconds to share this article if you like
    Share this article :
     

    Post a Comment

     

    Copyright © 2011. Tricks Duniya - All Rights Reserved