在mozilla / IE中淡出将无法正常工作

Question

here's one plugin i am trying to create

http://jsfiddle.net/9FcN3/2/

it works perfectly in chrome, but i cant get it working in Firefox and IE.. in Firefox second fade out does it without animation(simply disappears), and in IE its complete mess(starts function without click and doesn't animate fades)

can you please at least push me in right direction on this?

trying to get it working in IE version 9

HTML:

<div id="holder">
    <div id="thmb"></div>
    <div id="logo"></div>
    <div id="player">
</div>
<script type="text/javascript" src="js/ytplayer.js"  charset="utf-8></script>

</div>

JS:

  $('#thmb').click(function(){
  $(this).fadeOut('slow', timeout());
    function timeout(){
        setTimeout(function(){
        $('#logo').fadeOut('slow',play());
    },2000);
    }
  });

 function play() {
   if (player) {
     player.playVideo();
   }
  }

Answer 1

You are calling the function play,not assigning a reference to it.

$('#logo').fadeOut('slow',play());

needs to be

$('#logo').fadeOut('slow',play);

The other problem you have with IE is CSS. The layers are not being positioned the way you think they are. You should be setting wmode: "opaque"