Images play an important role in designing. So try to make each image stylish. Within the post mostly everyone focus on images in understand better about that topic. So to make images more beautiful today i going to introduce some piece of codes which gives tilt effect on mouse hover. Means when someone hover mouse button on the image it will bend little bit which makes your blog design more better. Simple add the code into your template then if will work for each and picture of blog post. So before using must check out the demo given to check out its working simple move your mouse and after testing demo if you want to add this effect on your blogger post then follow below given steps.
Demo of Tilt Image Hover Effect ?
How To Add This Tilt Hover Effect
- Open Your Blogger Dashboard >> Template
- Then click on Edit HTML and Search by ctrl+f into coding box for ]]></b:skin>
- After searching above code simple paste below given coding just above ]]></b:skin>
.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(-3deg);
-moz-transform: rotate(-5deg);
}
- After Pasting above code simple Save Your Settings
- Now open your any published blog post and test out by moving mouse on it.
For More Widgets:- Important Blogger Widgets And Plugins If you like this tutorial don't forget to share it with others.
0 Comments