Dancing effect (For Bloggers)
Do you like this story?
Hi Flocks,
Today i got a cool nice widget for all of you...
Have you ever imagined how it would look if your text or images bounce to left when you hover your mouse on them ????
Demo:-
Go To ILibrary
Sidharth Is Cool
Don't think so much just add this to your blog..
But be care full Don't change anything or else it will stop working !!!!
Steps are summarized bellow :-
Now Save the template by clicking on "Save template"
For Discussions Related To This Topic Please Click here
Today i got a cool nice widget for all of you...
Have you ever imagined how it would look if your text or images bounce to left when you hover your mouse on them ????
Demo:-
Go To ILibrary
Sidharth Is Cool
Don't think so much just add this to your blog..
But be care full Don't change anything or else it will stop working !!!!
Steps are summarized bellow :-
- Sign in to blogger then click on design then on the edit html tab..
- Now find "</head>" without ("") by pressing "Ctrl+F"
- Now paste the following code just above or before it ("</head>"):-
<!--DANCING-NUDGE-LINKS-STARTS-->
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() { $('a.nudge').hover(function() { //mouse in $(this).animate({ paddingLeft: '20px' },400); }, function() { //mouse out $(this).animate({ paddingLeft: 0 }, 400); }); });
</script>
<!--DANCING-NUDGE-LINKS-STOPS-http://ilibrary.tk-->
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() { $('a.nudge').hover(function() { //mouse in $(this).animate({ paddingLeft: '20px' },400); }, function() { //mouse out $(this).animate({ paddingLeft: 0 }, 400); }); });
</script>
<!--DANCING-NUDGE-LINKS-STOPS-http://ilibrary.tk-->
Now whenever you want to add this dancing effect to any of your links/images (either in widgets/posts), add this code (class="nudge") to the HTML "a" tag, like this:-
<a href="http://ilibrary.co.in" class="nudge">Link-Text</a>
- And to use images instead of text, use this code:
<a href="http://ilibrary.co.in" class="nudge"><img src="http://i41.tinypic.com/5wf6h5.jpg"/></a>
For Discussions Related To This Topic Please Click here
This post was written by: Franklin Manuel
Franklin Manuel is a professional blogger, web designer and front end web developer. Follow him on Twitter
Subscribe to:
Post Comments (Atom)
0 Responses to “Dancing effect (For Bloggers)”
Post a Comment