How To Add Image Zoom Effect For Blogger

Add This To Del.icio.us Tweet/ReTweet This Share on Facebook StumbleUpon This Add to Technorati Digg This

Zoom hover effect is very special for making more beautiful look of images in blogger. Actually zoom hover effect is a effect that zooms pictures or screenshots when you move or put your mouse cursor on images in blogger.

It's really cool effect. Now let's see how to add image zoom hover effect. Remember it's only for blogger. You can see a demo for you



View Demo
Go to Blogger → Design → Edit HTML

Back up your template for safety

Now tick on "Expand Widget Templates"

And find the following code Using CTRL+F

]]></b:skin> 

Paste following code just it

Click Here For The Code
Save your template

When you want to show zoom hover effect on pictures you have to use class="hovergallery" this code. Let's see an example

This is a image link

<a href="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s1600/Blog-Exposure-300x300.jpg"<img src="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s320/Blog-Exposure-300x300.jpg" /></a>

Now you have to add class="hovergallery" this code if you want to enable this effect on pictures. See below

<a class="hovergallery" href="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s1600/Blog-Exposure-300x300.jpg"<img src="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s320/Blog-Exposure-300x300.jpg" /></a>

I hope you already understood. you have to insert this code class="hovergallery" manually to every image if you want to show the effect and it's very easy

Please make comment if any ask, we appreciate you to share our posts with your friends if you like

Tweet

Zoom hover effect is very special for making more beautiful look of images in blogger. Actually zoom hover effect is a effect that zooms pictures or screenshots when you move or put your mouse cursor on images in blogger. It's really cool effect. Now let's see how to add image zoom hover effect. Remember it's only for blogger. You can see a demo for you View Demo Go to Blogger → Design → Edit HTML Back up your template for safety Now tick on "Expand Widget Templates" And find the following code Using CTRL+F ]]></b:skin> Paste following code just it Click Here For The Code Save your template When you want to show zoom hover effect on pictures you have to use class="hovergallery" this code. Let's see an example This is a image link <a href="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s1600/Blog-Exposure-300x300.jpg"<img src="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s320/Blog-Exposure-300x300.jpg" /></a> Now you have to add class="hovergallery" this code if you want to enable this effect on pictures. See below <a class="hovergallery" href="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s1600/Blog-Exposure-300x300.jpg"<img src="http://3.bp.blogspot.com/-8IpQF4KqkH4/T1IfrH5q99I/AAAAAAAAAMQ/y5vnM5WEM0o/s320/Blog-Exposure-300x300.jpg" /></a> I hope you already understood. you have to insert this code class="hovergallery" manually to every image if you want to show the effect and it's very easy Please make comment if any ask, we appreciate you to share our posts with your friends if you like