Onmouseover & onmouseout not working in IE

Question

I have a problem with onmouseover and onmouseout events. I am working on it on my site: http://pacogames.com/ When you visit it by Chrome or FF and you move with mouse over the games, you can see the video of the game, but when you visit it by IE, the video is played only when you are with mouse over the white space. When your mouse is on the image, you cannot see the video. (I mean the game in the div.BOXRIGHT).

Here is the code for expamle:

<li id="videobox-1" class="videobox">
  <a href="url_game" id="OdkazVideo1"> 
    <div id="video1">
    </div>
    <div style="display:block; position: absolute; top: 5px; width: 163px; height: 182px; z-index: 90;" onmouseover="PrehrajVideo(1, 'game_video.swf')" onmouseout="ZastavVideo(1)">
    </div> 
  </a>         
  <a href="url_game">   
   <img class="BOXGAMES_IMG" src="image_game.png" alt="play name_game" style="position: relative; z-index: 1;" /><br />game_name
</a> 
    <span style="width: 100px; height: 22px; float:left; padding: 5px 30px 0 30px;">'.$game['rating'].'</span>
    <p class="BOXGAMES_PLAYS">200 Plays </p>   
</li>';

And JS functions

function PrehrajVideo (id, video) {   

  var params = {
      'wmode': 'transparent',
      'quality': 'high',
      'mute': '1'
  }
  swfobject.embedSWF(video, "video"+id, "163", "123", "7", false, "", params, "" ); 
}

function ZastavVideo (id) { 
  swfobject.removeSWF("video"+id);
  $('#OdkazVideo'+id).prepend("<div id='video"+id+"'></div>");
}

Can anyone help me with this problem? Thanks a lot.

Answer 1

Use onMouseLeave event for IE. This will solve the problem.