将iframe放在HTML页面正文的特定位置？

我有以下..将iframe放在HTML页面正文的特定位置？

var insertbeforenode = document.body; 


var outerdiv = doc.createElement('div'); 
outerdiv.id = '_dialog_div'; 
outerdiv.style.display = "none"; 

var overlay = doc.createElement("link"); 
overlay.href = chrome.extension.getURL("overlay.css"); 
overlay.rel = "stylesheet"; 
overlay.type = "text/css"; 
outerdiv.appendChild(overlay); 

var iFrame = doc.createElement('iframe'); 
iFrame.id = '_dialog_iframe'; 
iFrame.name = '_dialog_iframe'; 

outerdiv.appendChild(iFrame); 
doc.body.appendChild(outerdiv);

然而，由于预期其追加的outerdiv到这是不是我想要做的页面的底部。我想在insertbeforenode之前插入它。我试过insertbeforenode.parentNode.insertBefore(outerdiv, insertbeforenode);，但这似乎不适用于Chrome。有没有人有任何解决方案？

编辑：只是为了澄清，我希望创建效果..

<html> 
    <head></head> 
    <iframe here> </iframe here> 
    <body> </body> 
</html>

来源

2011-02-11 Skizit

如果我正在阅读此权限，您正试图在*``之前插入*？你确定这就是你的追求？ – 2011-02-11 15:45:48

当我这样做在Firefox：

<html> 
    <head></head> 
    <iframe> </iframe> 
    <body> </body> 
</html>

它看起来与此相同：

<html> 
    <head></head> 
    <body> 
     <iframe></iframe> 
    </body> 
</html>

但是您的意见和笔记表明您正在尝试p在页面上绑定iframe而不改变底层内容的外观。

你真正想要的是这种结构：

<html> 
    <head></head> 
    <body> 
     <!-- Normal content goes here --> 
     <iframe> 
      <!-- Added iframe goes at the bottom --> 
     </iframe> 
    </body> 
</html>

然后你就iframe设置position:absolute;;给它通常的width和height;然后设置top,left和margins to center它。您可能还需要在iframe上使用z-index值，但这取决于页面的内容。

在<body>的底部添加一个绝对定位的元素是实现你想要做的事情的常用方法，在任何可以处理iframe的浏览器中，它的工作方式几乎是一样的。

下面是一个简单的例子：http://jsfiddle.net/ambiguous/KrjBv/。你已经知道如何做JavaScript了，我只是想说明CSS的定位，所以我用jQuery来减少噪音。

来源

2011-02-11 18:58:34

将iframe放在HTML页面正文的特定位置？

回答

相关问题