I have a such system: When the mainsite opens, A flash image gallery appears, when the user clicks on an image, using the Flash's "ExternalInterface.call" function, I call a javascript function that opens a java dialog modal named nyromodal (which fetches raw HTML data via ajax from another page inside the dialog box) on the flash movie. And thats when problem happens:
In Google Chrome it works well as intended, however issues happen with other browsers:
With internet explorer, dialog opens but when I click the "close" button the dialog stays there, weirdly if I minimize the IE button and maximize it, the dialog dissapears.
With Firefox, while opening the triggered dialog, dialog windows displays nothing but some corrupted graphics but if I move my mouse, it shows the contents.
What can cause this problem? How can I fix it ?
Here is the source code, site is not up on anywebsite thus I am not able to show it directly:
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" href="/media/style.css" rel="stylesheet" />
<link rel="stylesheet" href="/media/nyroModal.full.css" type="text/css" media="screen" /> <script type="text/javascript" src="/media/jquery.js"></script>
<script language="javascript">AC_FL_RunContent = 0;</script>
<script type="text/javascript" src="/media/AC_RunActiveContent.js"></script>
<script type="text/javascript" src="/media/jquery.nyroModal-1.5.2.pack.js"></script>
<script type="text/javascript">
function showItem(i,x){
var myurl = "/item/?i="+i;
$.nyroModalManual({url:myurl,title:x});
}
</script>
</head>
<body bgcolor="#000000">
<!--url's used in the movie-->
<!--text used in the movie-->
<!-- saved from url=(0013)about:internet -->
<div STYLE="z-index: 1;"><center>
<script language="javascript">
if (AC_FL_RunContent == 0) {
alert("This page requires AC_RunActiveContent.js.");
} else {
AC_FL_RunContent(
'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0',
'width', '100%',
'height', '600',
'src', '/media/preview',
'quality', 'high',
'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
'align', 'middle',
'play', 'true',
'loop', 'true',
'scale', 'noScale',
'wmode', 'transparent',
'devicefont', 'false',
'id', 'preview',
'bgcolor', '#2e2e2e',
'name', 'preview',
'menu', 'true',
'allowFullScreen', 'false',
'allowScriptAccess','sameDomain',
'movie', '/media/preview',
'salign', ''
); //end AC code
}
</script>
<noscript>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="1024" height="850" id="preview" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="/media/preview.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#000000" /> <embed src="/media//media/preview.swf" quality="high" bgcolor="#000000" width="100%" height="850" name="preview" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</noscript>
</center>
</div>
</body>
</html>
Transparent won't work for this. In order to show HTML over Flash, you need to show your movie with wmode="opaque".
Also, setting CSS zIndex property to 0 for the movie and 1000 (or anything above 0) to the popup will help in some browsers.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With