jquery - Check if mouse is hovering on any object -

i have jquery animation example here: http://jsfiddle.net/p7eta/

i all titles pop out if mouse not within container div @ all. have tried like:

$("#container").mouseout(       function() {     //slides spans     $('.popup').stop().animate({         bottom: 0 + 'px'     });  }); 

but not work prior animations. correct way achieve effect?

edit: i'd similar this: http://jsfiddle.net/re3xk/ on mouseover i'd individual span titles pop in first example instead of having them dissapear

finally, jsfiddle cooperated...

i'm doing hacky, it's way work. had add .hover class hovered element, code doesn't work without it. don't @ code, , it'll nice!

here's working example: http://jsfiddle.net/p7eta/41/

and code:

// javascript document  //when div.popup moused on moused on $("#slider div.block").hover(  function() {      //slides spans     $(this).addclass('hovered');     $(this).find('span').stop().animate({         bottom: '0px'     }); }, function() { $(this).removeclass('hovered');     //slides spans down     $(this).find('span').stop().animate({         bottom: '-200px'     }); });  $('#container').hover(function() {     $('#slider div.block:not(.hovered) span').animate({         bottom: '-200px'     }); }, function() {     $('#slider div.block span').stop().animate({         bottom: '0px'     }); });