Add Round Hover Effect to Images of your Blogger Blog Posts

This is our 1st post of the new year 2014 and in this post I'm going to share another Hover effect for your Blog. You may have seen Image hover effects on many blogs. The hover effect I'm going to share with you today will change the default image border to round border on hover. This effect works on CSS and adding this effect to your blog is very easy. So, guys follow the steps below to add this Image Hover effect to your blog.

Recommended Posts:
Add Hover Effect to Images of your Blogger Blog Posts

Adding Round Hover Effect to Images of your Blog

Step 1. Log in to your Blogger Dashboard

Step 2. Go to Template >> Click on Edit HTML and search (Ctrl + F) for the Following Tag

]]></b:skin>

Step 3. Copy the Below code and Paste it just above/before the ]]></b:skin> tag - See more at: http://blogolect.blogspot.com/2013/12/add-hover-effect-to-images-of-your-blog-posts.html?showComment=1388413555068#c8192196137529708425

Add Hover Effect to Images of your Blogger Blog Posts - See more at: http://blogolect.blogspot.com/2013/12/add-hover-effect-to-images-of-your-blog-posts.html?showComment=1388413555068#c8192196137529708425

Step 1. Log in to your Blogger Dashboard
Step 2. Go to Template >> Click on Edit HTML and search (Ctrl + F) for the Following Tag

]]></b:skin>

Step 3. Copy the Below code and Paste it just above/before the ]]></b:skin> tag

.post img {
text-align:center;
border:3px solid #39F;
-webkit-border-radius:0;
-moz-border-radius:0;
-o-border-radius:0;
border-radius:0;
margin:0 2px 4px 0;
padding:2px;
}

.post img:hover {
text-align:left;
border:3px solid silver;
-webkit-border-radius:70px;
-moz-border-radius:70px;
-o-border-radius:70px;
border-radius:70px;
-webkit-transition:all .45s ease-out;
-moz-transition:all .45s ease-out;
-o-transition:all .45s ease-out;
transition:all .45s ease-out;
margin:-6px -8px -8px -6px;
padding:1px;
}

Step 4. Click on Save Template button

From Editors Desk

I hope that you will like this image hover effect, Give us your Feedback and Enjoy Blogging !Feel Free to Ask. Your Feedback is always highly appreciated - See more at: http://blogolect.blogspot.com/b/post-preview?token=_xfJSUMBAAA._QudqCLLg7WGzaDyI8xMBQ.Kx0AKv8MK84qcLnfGHzLMQ&postId=3783301090408238732&type=POST#sthash.PIEvAy4V.dpuf

I hope that you will like this image hover effect, Give us your Feedback and Enjoy Blogging !
Feel Free to Ask. Your Feedback is always highly appreciated

I hope that you will like this image hover effect, Give us your Feedback and Enjoy Blogging !
Feel Free to Ask. Your Feedback is always highly appreciated - See more at: http://blogolect.blogspot.com/2013/12/add-hover-effect-to-images-of-your-blog-posts.html?showComment=1388413555068#c8192196137529708425I hope that you will like this image hover effect, Give us your Feedback and Enjoy Blogging !Feel Free to Ask. Your Feedback is always highly appreciated

Today I'm going to share an easy and amazing Blogger trick. You may have seen Image hover effect on many blogs. The hover effect I'm going to share with you today will glow the images of your Blogger Blog posts. When you move your mouse over an image it will Glow the image in red color (You can also change the color by replacing the hex color codes). So, guys follow the steps below to add this Image Hover effect to your blog. - See more at: http://blogolect.blogspot.com/2013/12/add-hover-effect-to-images-of-your-blog-posts.html?showComment=1388413555068#c8192196137529708425