【发布时间】:2010-10-22 04:15:17
【问题描述】:
在我正在开发的带有窗口系统的 Internet Explorer 中,我遇到了一个真正的... bizzare 错误。基本上,窗口是绝对定位的 div,其中包含 ah iFrame,显示它们的页面并与它们一起调整大小。在所有其他浏览器中,这可以正常工作,但在 IE 中,iFrame 无法正常显示。
生成新窗口的原始代码如下所示:
function spawnNewWindow(url, title, type)
{
//Does another window with that particular type already exist?
//If so, just point it at the new link without actually spawning a new window.
var cancelSpawn = false;
if ( $('.windowType_'+type).length )
{
//Update the SRC attribute for the iframe contained within the window. This should effectively
//reload the window too.
$('.windowType_'+type).children("iframe").attr("src", "/darknova4/"+url);
} else {
//First, create the window
$("body").append(
"<div class='window'> \
<div class='resizeArea'></div> \
<div class='titlebar'>"+title+"</div> \
<div class='closeWindow'></div> \
<div class='windowContent newspawn'><iframe src='/darknova4/"+url+"' frameborder='0' width='100%' height='100%' scrolling='auto'></iframe></div> \
</div>");
//Move this window to the top of the stack
$(".newspawn").parent(".window").css("z-index", windowZIndex++);
//Set the data for this window's type, will be used to prevent copy windows being open later
$(".newspawn").addClass("windowType_"+type);
//Set up the window for moving and resizing and other stuff
setupWindows();
//Finally, remove the "newspawn" flag from the window, since it has content and we don't need work with it anymore.
$(".newspawn").removeClass("newspawn");
}
}
在 Internet Explorer 上,这会产生一个空白的白色窗口,这表示一个不可见的 iFrame,因为我所有的窗口页面都有黑色背景。我怀疑著名的(但仍未完全修复)z-index 错误,因此我进行了以下更改以使用堆叠顺序并查看是否可以找到快速修复:
$("body").append(
"<div class='window'> \
<div class='resizeArea'></div> \
<div class='titlebar'>"+title+"</div> \
<div class='closeWindow'></div> \
<div class='windowContent newspawn'><iframe style='position: relative;' src='/darknova4/"+url+"' frameborder='0' width='100%' height='100%' scrolling='auto'></iframe></div> \
</div>");
注意相对位置,应该是对象的默认位置,但这不是因为堆叠错误。这段代码会发生什么,窗口出现,iFrame 出现,一切看起来都很好,直到你尝试使用它。我无法解释原因,但鼠标悬停在 iFrame 上会导致它消失。我在网站上没有与鼠标移动事件相关的代码,并且 iFrame 页面上没有代码会导致它在鼠标悬停时执行任何操作。这真的很奇怪。有没有人知道它为什么会这样?
如果您需要亲自查看此行为,我已经在 www.darknovagames.com 上对系统进行了测试,该系统在 Firefox 中运行良好,但如前所述,在 IE 中确实很奇怪。如果您认为有帮助,我可以发布更多代码,但这是我认为错误所在。也就是说,我很乐意在父窗口上发布 CSS 和鼠标事件的 JavaScript 等。
感谢任何可以就这种奇怪行为提供一些见解的人。
【问题讨论】:
-
在 IE6 中它的行为略有不同。窗口显示出来并且可以拖动 - 但它没有内容(也没有关闭按钮),从页面加载开始。
-
是的,我绝对应该提一下,很久以前我的所有网站项目都放弃了对 IE6 的支持。尝试支持 2 代旧软件对我来说似乎很愚蠢,你知道吗?
-
你的 iframe 有内容吗?外部div的大小是多少?