In this post we will add effect to the links in your label list. We will add a hover effect to the label list, and when your user place their cursor on the label it will move horizontally. Isn't it is good, I had also added this gadget. You can see live demo of this gadget in my blog labels.

ADD ANIMATED EFFECT TO YOUR BLOG LABEL LIST
1). Open your blog and go to Dashboard.

3). Find the following piece of code in your blog HTML code. HOW TO FIND CODE IN YOUR BLOG HTML CODE
</head>
NOTE :- Before making any changes you should backup your blog template code. HOW TO BACKUP YOUR BLOG TEMPLATE
4). Paste the following code just above/before the code you have searched.
</head>
4). Paste the following code just above/before the code you have searched.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'>
</script>
<script type='text/javascript'>
var dur = 450;
$(document).ready(function() {
$('a.linknudge, .Label ul li a').hover(function() {
$(this).animate({
paddingLeft: '20px'
}, dur);
}, function() {
$(this).animate({
paddingLeft: 0
}, dur);
});
});</script>
<!--End Animated Label Links For Blogger http://www.pcleaks.blogspopt.com-->
5). Save your template and experience the change.
If you got a good experience than leave comments and Email Me for any assistance.
5). Save your template and experience the change.
If you got a good experience than leave comments and Email Me for any assistance.
No comments:
Post a Comment