Div有透明背景时有iframe吗？

我有一个网页，拥有一个iframe：Div有透明背景时有iframe吗？

<div style="position:absolute; width:80%; top:100px; left:10%; z-index:5;"> 
    <iframe src="www.google.com" /> 
</div>

注意iframe的来源可以是来自另一个域，所以我不能在它更改HTML。

除此之外ifame我有一个菜单，并在底部的一些装饰图像：

<div id="menu" style="position:absolute; width:100%; top:0px; left:0px; z-index:100;"> 
    ... 
</div> 

<div id="footer" style="position:absolute; width:100%; bottom:0px; left:0px; z-index:0;"> 
    ... 
</div>

正如你所看到的，我给z-index的每个格，所以应该按照这个顺序来显示：顶部的菜单，其后是带有iframe的div，最后是页脚图像。

我想要的是，iframe（和div拥有它）没有背景（透明bg颜色，如果你喜欢），所以它后面的背景和页脚图像将是可见的。请注意，我只想更改背景颜色;文字不得改变或不透明。

我设法去的背景图片，并改变它（使用jQuery）：

if ($.browser.msie == false) { 
    $(document.getElementById("content").contentDocument.body). 
         css('background', "url('transparent.png')"); 
} 
else { 
    $(document.getElementById("content").Document.body). 
         css('background', "url('transparent.png')"); 
}

它的工作原理马丽娟上的iframe，但保持它在某种程度上股利得到一个白色背景。

如果我将div的背景设置为'transparent.png'图片，它将不会改变;该div仍然会保存它的白色背景！

如果我用表替换div，iframe会在页脚图像后面（尽管它的z-index更大）。

所有我想要的只是看到页脚图像该iframe背后...

请帮帮忙，我很绝望...：（

来源

2009-10-28 Orad SA

尝试：

background: transparent url('transparent.png');

有一点需要注意，IE6不支持Alpha透明的PNG图像。你会想要一个IE特定的样式表，并使用IE浏览器只为此。

只是为了clearify，你arn't试图摆脱的iframe本身的背景色，而只是能够看到页脚和头是否正确？如果是这种情况，则应该使用HTML4.01文档类型。

<div style="position:absolute; width:80%; top:100px; left:10%; z-index:5;"> 
    <iframe style="background-color: transparent;" src="testframe.html" allowtransparency="true"></iframe> 
</div>

来源

2009-10-30 13:41:24 thismat

非常感谢你，它有用finnaly！关于你的问题，我确实想摆脱iframe中的背景色;我已经尝试在iframe上放置allowtransparency =“true”;不知何故，它不在IE8中工作。我没有得到你写的关于IE6的东西; 'transparent.png'会对它起作用吗？再次感谢！ – 2009-10-30 21:53:27

它的基本要点是，alpha透明度在png中（像透明背景）不会在IE6中呈现，对此有一种破解，通常将它应用于仅限IE的条件样式表是个好主意。这里的一些信息：http://stackoverflow.com/questions/130161/ie6-issues-with-transparent-pngs 此外，如果PNG只是一个1x1透明图像，我会使用一个GIF，因为它doesn不会受到同样的限制。通常，在透明胶片中使用alpha透明胶片时，会使用更高级的透明度，例如渐变渐变。 – thismat 2009-11-02 14:12:42

我试用了无法复制。这里的问题是我主要的html：

<div style="background:red;"> 
<div> 
    <iframe src="test2.html" /> 
</div> 
</div>

而这里的test2.html：

this is a test file

这DIS在iframe背后带有红色背景的iframe中播放“这是一个测试文件”。你能发布一些代码来澄清你的问题吗？

来源

2009-10-28 22:21:47 Travis

这不适合我。我试过你的解决方案多一次，无论是在IE和Firefox;它只是在iframe中放置一个白色背景。 – 2009-10-28 22:37:59

啊，我明白了。这适用于FF3.5，但不适用于IE8。我会发布一些新的东西，如果我能弄明白的话。 – Travis 2009-10-28 23:12:56

你尝试透明背景的div和半透明的背景图像的iframe？

来源

2009-10-28 22:26:55 TeKapa

确实，现在“base”div的bg是可见的，但是我在iframe中的所有文本都会获得不透明度过滤器，但是它说不可见。我只想将背景变为透明。 – 2009-10-28 22:45:09

CSS：

<style> 
    .hid 
    { 
     filter: alpha(opacity=70); 
     opacity: 0.7; 
     -moz-opacity: 0.7; 
    } 
</style>

HTML：

<iframe class="hid"></iframe>

这将这样的伎俩。我在IE6上试过了，它在那里工作。

来源

2011-11-13 12:02:39 Nuwan

Div有透明背景时有iframe吗？

回答

相关问题