Dancing effect (For Bloggers)
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
About Me
- Sidharth
- This is Sidharth, the proud admin of ILibrary. He is a student(+2) and aspires to be Popular..... He likes to Share his works and so here is the Platform Where he is going to share all his works.... Never miss out a post...... Follow us By email to keep yourself up to date !!!!