Android Helping is a way to get information on Android knowledge.

Add Awesome jQuery Affect to Blogger Labels

Hello Tricks For Tips users, today we are going to learn how to give awesome jQuery affect to blogger labels. On mouse hover labels will slowly slide to left that looks awesome as shown here.
Image result for blogger labels
This affect is also eye catching that encourage visitors to click on them. It takes only ten seconds to install this awesome affect. If you are thinking of why to install this than i have a solid reason that it will help you to get a little amount of love of visitor and this little love can be changed in to a big benefit. Also i will explain a code little that helps you to do changing according to your need.

Installing Awesome jQuery Affect to Blogger labels

Follow all below steps to add this in your template
STEP 1: Go to blogger's Dashbord and choose templates section
STEP 2: Now click on edit Html
STEP 3: Now press Ctrl + F and search for </head>
STEP 4: Now paste the below code code just before/above </head>

</head>


    <script

src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquer

y.min.js' type='text/javascript'>

        </script>
        <script type='text/javascript'>
            var dur = 400; // Duration Of Animation in Milli

Seconds
            $(document).ready(function() {
                $(&#39;a.linknudge, .Label ul li

a&#39;).hover(function() {
                    $(this).animate({
                        paddingLeft: &#39;25px&#39;
                    }, dur);
                }, function() {
                    $(this).animate({
                        paddingLeft: 0
                    }, dur);
                });
            }); // end of Jquery Script
        </script>

    STEP 5:  Now Click on save template and visit blog to see changing.

Here is what you can do?

I have highlighted a javascript with green color, that is jQuery script you can remove it if you have already installed in your template but reading will not cause any problem so don't worry. Now is blue color that indicates sliding of label to right or left you can cutomize it if you wish.
Share:

No comments:

Post a Comment

If you have any problem and questions related to this article then please ask them. One of our moderators will reply soon. Please keep in mind that all the comments are checked for moderation and spam ones are deleted immediately. These spam contacts also include those which are not related to this article. Thanks for understanding !

Popular Posts

Recent Posts

Unordered List

  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  • Aliquam tincidunt mauris eu risus.
  • Vestibulum auctor dapibus neque.

Sample Text

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation test link ullamco laboris nisi ut aliquip ex ea commodo consequat.

Pages

Theme Support

Need our help to upload or customize this blogger template? Contact me with details about the theme customization you need.