JavaScript 对话框覆盖在 Flash 动画上。

3
我有这样一个系统:当主站打开时,会出现一个闪存图库,当用户单击一张图片时,使用Flash的“ExternalInterface.call”函数,调用一个名为nyromodal的java对话框模态窗口的javascript函数(通过ajax从对话框盒子内的另一页获取原始HTML数据)。这就是问题发生的时候:
在Google Chrome中,它按预期正常工作,但其他浏览器存在问题:
- 在Internet Explorer中,对话框打开,但当我单击“关闭”按钮时,对话框仍然存在,奇怪的是,如果我最小化IE按钮并将其最大化,则对话框消失。 - 在Firefox中,虽然打开了触发的对话框,但对话框窗口显示的只是一些损坏的图形,但如果我移动鼠标,它就会显示内容。
是什么导致了这个问题?我该如何解决?
以下是源代码,该网站尚未上载到任何网站,因此无法直接显示:
<!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>
5个回答

8

透明模式对此无效。为了在Flash上显示HTML,您需要使用wmode="opaque"来显示您的电影。

此外,在某些浏览器中,将CSS zIndex属性设置为0,对于电影和1000(或任何大于0的值)对于弹出窗口也会有所帮助。


1
var flashFlag = false;
var flashObjs;

// on javascript Dialog open event
flashFlag = checkflashContent();

function checkflashContent() {    
    //alert('checking for flash');    
    var flashObjects = new Array();    
    var flag = false;

    for (i = 0; i < document.getElementsByTagName("object").length; i++) {    
        flashObjects[i] = document.getElementsByTagName("object")[i];

        // alert('found flash');    
        jQuery(flashObjects[i]).hide();    
        flag = true;    
    }    
    flashObjs = flashObjects;    
    return flag;    
}

// on Javascript dialog close event
function closeDialog(){
...
...
if (flashFlag) {    
    //alert('dialog closed, showing flash');

    for (i = 0; i < flashObjs.length; i++) {    
        jQuery(flashObjs[i]).show();    
    }    
}

// On Open Event get the elements by tag Name (OBJECT) 
// and use jQuery .hide to hide the content and on 
// dialog close event use jQuery .show to show the flag back.

0

您需要使用透明或不透明的wmode来嵌入Flash。

但是要准备好享受一些乐趣。它周围有一些奇怪的错误。


我已经添加了透明度,你可以在我的源代码中看到。但这并没有帮助。 - Hellnar
+1 Simon。没注意到你也建议了这个。但请注意,transparent不起作用,只能使用opaque。这就是为什么它对他不起作用的原因 :) - Seb

0

听起来你的浏览器安装出了一些问题,无论嵌入式配置如何,这应该根本不是一个问题。警报窗口基本上是在Win32/OS级别生成的,如果它们显示不正确或损坏,那么你的电脑就有问题了。


0

你的HTML和XHTML混合使用有些奇怪。我建议去掉center标签,body标签上的bgcolor属性,并将wrapper div的样式放入style中,即使只是嵌入页面。

话虽如此,我能想到可能会导致问题的唯一原因是你在div上设置了z-index,但没有设置position属性。尝试在div上添加position: relative属性,看看是否解决了问题。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接