HOW TO MAKE LINK MOVING WHEN HOVERED

How to make link moving when hovered with cursor? Now if you want to make a link shaking when a cursor hovered on it, there's will be quite fun.

Put this code before </head> or before </body>.

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() { $('a').hover(function() { $(this).animate({ marginLeft: '10px' }, 400); }, function() { $(this).animate({ marginLeft: 0 }, 400);
//]]>
</script>

jQUERY: ESSENTIAL

You need one of version jQuery, something like these:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js' type='text/javascript'/>

Put this code before </head> or before </body> too.

Read also: How to use Cookies Notification Bar

PLAYGROUND: EXAMPLE CSS HOVER LINK:

a:focus, a:hover {
color:#333;
text-decoration:none;
text-transform:uppercase;
border-bottom:1px solid #ddd;
margin-top:0;
text-shadow: 0.5px 0.5px 0.5px #f4da70;
-o-transition: all 2s ease-out;
-moz-transition: all 2s ease-out;
-webkit-transition: all 2s ease-out;
}