JQuery Help with Hover/Fade/Animate Image

Answer 1

Try this code out as I think I got it to do what you wanted. I pulled out your fadeIn and fadeOut animations and put them into a separate hover (for the <ul>). I didn't touch the CSS or the HTML.

$(document).ready(function(){
 $('#nav1 li.bg').css({opacity: 0, visibility: "visible"});

 $('#nav1').hover(function(){
  $('#nav1 li.bg').animate({opacity: 1, visibility: "visible"},400);
 }, function(){
  $('#nav1 li.bg').animate({opacity: 0, visibility: "hidden"},400);
 })
 $('#nav1 li a').hover(function(){
  var offset=$(this).offset();
  var thiswidth =$(this).width()+13;
  $('#nav1 li.bg').animate({left:offset.left+"px",width:thiswidth+"px"},100);
 }, function(){
  $('#nav1 li.bg').animate({left:offset.left+"px",width:"60px"},100);    
 });
})