$(document).ready(function(){	
$("td#1").mouseover(function(){
        $(this)  
   // stop any animation that took place before this  
   .stop()  
   // step.1 move down navigation item  
   .animate({backgroundPosition:'(' + _getHPos( this.id ) +'px 40px )'}, "fast",   
     // this section will be executed after the step.1 is done  
     function(){  
       // step.2 white box move really fast  
       $(this).children().animate({backgroundPosition:'(0px 70px)'}, "fast");  
       // step 3. move navigation item up  
       $(this).animate( {backgroundPosition:'(' + _getHPos( this.id ) +'px -40px)'}, "fast",   
       // this section will be executed after the step.3 is done  
         function(){  
           // step 4. move navigation item ot its original position  
           $(this).animate( {backgroundPosition:'(' + _getHPos( this.id ) +'px -25px)'}, "fast",  
             // this section will be executed after the step.4 is done  
             function(){  
               // move white box to its original position, ready for next animation  
               $(this).children().css({ backgroundPosition:'0px -60px'});  
            })  
        })  

    });

		
		
		
		
	
		
		
		
});