Contact Us:

If You Have Any Problem, Wanna Help, Wanna Write Guest Post, Find Any Error Or Want To Give Us Feedback, Just Feel Free To Contact Us. We Will Reply You Soon.

Name: *


Email: *

Message: *


Skillblogger

Download our app on Google Play Store

Wednesday, April 3, 2013

Add Cute Mobility Effects On Blogger Images

Add Cute Mobility Effects On Blogger Images
After the previous blog entries about how to create blog out of blogger platform, we move now  to the terrific addition to the images  in your blog, a very beautiful way to put effects on images.These pictures give added elegance and perfect coordination in the development of the mouse pointer on the image and swaying to side when the mouse pointer away from it, is back to normal.
Many lovers of blogger additions using this property in their blogs long ago where they need to add some codes in addition to the work of this image link, that we want to influence her, and repeated process with each addition of images.
After a personal effort of my friend Mohamed thus able to make code to be added once to the template in order to be enabled to influence all the images without exception, and in particular the images of conclusions "Read more" is also subject to this property, which gives the blog attractive and a wonderful aesthetic , and now let's move to apply code.
Scroll to your blog control panel, select the "design", then "Edit HTML" .
check the box templates expand the user interface elements. then search for the following code, drawing on the control panel (CTRL + F) 

]]></b:skin>


If you found it, place the following code before it 

.post img {-webkit-transition: -webkit-transform .15s linear;
-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25);
-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25);
padding: 5px 5px 5px 5px;
-webkit-transform: rotate(+2deg);
-moz-transform: rotate(+2deg);
}

.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(-1deg);
-moz-transform: rotate(-1deg);


You can control the degree of Milan pictures as you like and as well as at them both to the left or to the right and it replaces the symbol (+) symbol (-) and vice versa, where the value represents 2deg + degree inclination before you put the mouse pointer as a well as the value 1deg-degree inclination in the development index mouse on the image.

Make the save data and briefed on the blog to preview the addendum, if everything worked as it should then leave your comment on the subject and share it with your friends on Facebook and Twitter.  
That's it, I hope you like this add-on. Happy Blogging!
Like the Post? Share with your Friends:-

Team SB
Posted By: Team SB

0 comments :

POST A COMMENT

Download our app on Google Play Store

Contact Us

Name

Email *

Message *

 
Copyright © . Skill Blogger . All Rights Reserved.
Designed by :- Way2themes