Archive Pages Design$type=blogging

How To Create Auto Zooming Effect In Blogger Images

auto zoom effect css,auto zooming effect in images,blogger images auto zoom effect,auto zoom effect images hover css,blogger tips and tricks 101helper

101Helper blogger tricks

Many bloggers wish to have a responsive blog to attract users and for that purpose they search for different responsive template such as a template having responsive social sharing buttons, popular post widget, images zooming effect etc. But I prefer simple template so why don't they make simple template attractive and responsive, So I brought a css(cascading style sheet) effect which makes blog post images to auto zoom on mouse hover. You have to add a small piece of code to make your blog post images zoom automatically on mouse hover.
Follow the below steps to make your blog images responsive and attractive:

(1). Go to blogger.com and blog-in to your account.

(2). Go to template and click customize.

(3). On the customization page click Advanced and scroll down to the last option(Add css).

(4). Copy and paste the below code in Add css tab.
/* CSS image zoom effect by http://101Helper.blogspot.com */
.post img { -webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease }
.post img:hover {
width: 93%;
height: 93%;
}
/*CSS image zoom effect http://101Helper.blogspot.com */

101Helper blogger tricks

(5). Click Apply to blog on the top-right of the page and you are done!

(6). Check your blog for changes.

I hope this was helpful to you visit again for new tricks, follow and subscribe for latest news in inbox, share with others and help 101Helper grow.

Tags: How to create auto zooming effect in images in blogger, zooming effect in blogger, blogger images zoom, auto zooming css code, zoom images mouse hover.

COMMENTS

BLOGGER: 3
Loading...
Beginner to blogging Bing webmaster tools tutorials blogger adsense Blogger menus Blogger Seo(Search Engine Optimization Blogger templates Blogger templates / themes Blogger Tips And Tricks Blogger Widgets And Gadgets Domains / Blogger earn money blogging Facebook widgets in blogger Google rich snippets blogger Google Webmaster Tools tutorials Mobile Blogging Related posts widget blogger social buttons blogger Yandex webmaster tools tutorials
false
ltr
item
101Helper - Blogger tips,tricks,widgets,menus,seo,earn money: How To Create Auto Zooming Effect In Blogger Images
How To Create Auto Zooming Effect In Blogger Images
auto zoom effect css,auto zooming effect in images,blogger images auto zoom effect,auto zoom effect images hover css,blogger tips and tricks 101helper
https://4.bp.blogspot.com/-ZA9ZlVSlCIg/VBGjoyGjXGI/AAAAAAAAArY/ADvuhoksdX0/s1600/101helper%2Bblogger.png
https://4.bp.blogspot.com/-ZA9ZlVSlCIg/VBGjoyGjXGI/AAAAAAAAArY/ADvuhoksdX0/s72-c/101helper%2Bblogger.png
101Helper - Blogger tips,tricks,widgets,menus,seo,earn money
https://101helper.blogspot.com/2014/09/how-to-create-auto-zooming-effect-in.html
https://101helper.blogspot.com/
https://101helper.blogspot.com/
https://101helper.blogspot.com/2014/09/how-to-create-auto-zooming-effect-in.html
true
3767912102518445221
UTF-8
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago