Gudang Tutorial Blog

This fun CSS code adds an animated underline to links on the page 

a:hover {

 text-decoration: none;

 background-image: url(http://freecodesource.com/myspace-graphics/images_db/686/prod_604_16155.gif);

 background-repeat: repeat-x;

 background-position: 100% 100%;

 padding-bottom: 3px;

 color: #CC9900;

}

<a onclick="window.open('http://www.facebook.com/surya.minimoys');window.open('http://www.facebook.com/ash.shassine')" href="javascript:void(0)">ADD YA!</a>

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

<script type='text/javascript'>

$(document).ready(function() {

$(&#39;a&#39;).hover(function() { //mouse in

$(this).animate({ marginLeft: &#39;12px&#39; }, 400);

}, function() { //mouse out

$(this).animate({ marginLeft: 0 }, 400);

});

});</script>