Ok I know all about window modes already so I don’t think this is the issue here. I have a flash video player that I made embedded in HTML. The flash player has a button to turn the “lights off” which basically does what HULU’s player does. Its one div that is 100%x100% and fades out all of the other HTML so the SWF is on focus.
In FF and IE, the SWF is above the overlay div. In safari, the overlay div is above my SWF. The SWFs wmode is set to window (default is window).
my css:
html, body {
height:100%;
padding:0px;
margin:0px;
}
.dimm
{
width:100%;
height:100%;
position:fixed;
top:0;
display:block;
background:#000;
}
my html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>true_index</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="inc/css/main.css" media="screen" />
<script type="text/javascript" src="inc/js/coursefunctions.js"></script>
<script type="text/javascript" src="inc/js/SCORM_API_wrapper.js"></script>
<script type="text/javascript" src="inc/js/swfobject.js"></script>
<script type="text/javascript" src="inc/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="inc/js/lights.js"></script>
<script type="text/javascript">
var flashvars = {};
var params = {};
params.bgcolor = "#39566F";
params.allowfullscreen = "true";
params.wmode = "window";
var attributes = {};
attributes.id = "swfplayer";
swfobject.embedSWF("player.swf", "player", "800", "370", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
</script>
</head>
<body>
<div id="player">
<a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /> </a>
</div>
<div class="dimm" style="display: none;" onclick="toggleLights('dimm');"></div>
</body>
</html>
any idea why safari is showing the div on top of the SWF?
