$(function(){
               $('#navigation li a').append('<span class="hover"></span>');  
			   $('#navigation .hover').css("filter","alpha(opacity=00)");
               // span whose opacity will animate when mouse hovers.  
      
               $('#navigation li a').hover(  
                 function() {  
                 $('.hover', this).stop().animate({  
                'opacity': 1  
                }, 700,'easeOutSine')  
                },  
                function() {  
               $('.hover', this).stop().animate({  
                'opacity': 0  
                }, 700, 'easeOutQuad')  
      
        })  
    });