Image hover effect in blogger, is a trick used by many of pro bloggers. When you move your cursor to any of the image the hover effect over it takes place and its view is more clear then before.It's a small css trick that is done by adding styling to your blog css and define its class while using your image url in blog posts.

How to make image hover over effect.

• Log in to blogger ID.
• Got To LAYOUT > EDIT HTML > Press Ctrl+F.
• Search for </head>

And place the below css above </head>. Now save the Template.

Now whenever you embed your image in blog or blog posts you use codes like below.

Whenever you use blue codes like below in your blogs for images.

<a href="http://freetidbit.blogspot.com" target="_blank" alt="Scenery"><img src="http://i482.photobucket.com/albums/rr190/f_ms/SCENERY/Fallstream.jpg"/></a>

Use below green code in place of above blue code to have hover effect.

<a class="linkopacity" href="http://freetidbit.blogspot.com" target="_blank" alt="Scenery"><img src="http://i482.photobucket.com/albums/rr190/f_ms/SCENERY/Fallstream.jpg" /></a>

Difference in both codes is that i have added class=linkopacity in red in second code.

Example:

Before adding the code



After adding class=linkopacity



REFERENCES:- Blogspot Blog