How to Create a Link Swaying In Blog

How to create a link on the blog rocked called link nudging or Nudge, but for bloggers who would not know the lay of these securities, which they know that the link will sway or move to the left when visited by a mouse or pointer. Well, this time I will give a brief tutorial so that links can be swayed, he he he .. :)




Only the direct subject of how to create a link sway on the blog, follow the steps below!

1. Log in to your blogger
2. Sign in to design / design
3. Choose Layout
4. Edit HTML
5. Then look berkut code: </ head> (use Ctrl + F on your keyboard sob), after the meet to stay put following CSS code right above </ head>:

_________________________________________________________

 <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 = 400; // Duration Of Animation in Milli Seconds
$(document).ready(function() {
$('a.linknudge').hover(function() {
$(this).animate({
paddingLeft: '25px'
}, dur);
}, function() {
$(this).animate({
paddingLeft: 0
}, dur);
});
}); // end of Jquery Script
</script>

__________________________________________________________


      6.  Save your template.


Description:

•      The red is a link distance for the sway motion, set according to what you want .. do not be long-term,, hiks hiks hiks ..
•      For those who have put jquery script

               http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js
          no need to install it again.

•      If you want to create a link that you want to sway then add the code below in red on your link. How to install on the link or just add the code buddy class "linknudge" for the link mate like the example below:

___________________________________________________________
 <a class='linknudge' href='http://penuhtutorial.blogspot.com/'>tutorial</a>
___________________________________________________________

 Way or the above code is to link the costumes, by adding a class code 'linknudge'.
Here is the code for the label and the other for your custom link:
___________________________________________________________

<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 = 400; // Duration Of Animation in Milli Seconds
$(document).ready(function() {
$('a.linknudge, .Label ul li a').hover(function() {
$(this).animate({
paddingLeft: '25px'
}, dur);
}, function() {
$(this).animate({
paddingLeft: 0
}, dur);
});
}); // end of Jquery Script
</script>

___________________________________________________________ 

Thus creating a link on the blog or link sway nudging, good luck .. :-)

Posted in: blog tutorials