javascript - 如何使 iframe 的 div float 在 iframe 的另一个 div 之上，该 div 应该作为页面的背景

我读了很多相关的问题，但我的情况似乎有点不同，这些问题都不适合我。

我想要实现的是拥有一个 float 广播播放器，可以在我的博客中不间断地播放音乐。我使用 iframe 将我的博客作为整个页面的背景，然后将另一个用于广播播放器的 iframe float 在前一个 iframe 之上。

我想我发现的所有方法都不起作用的原因是因为我的 iframe 的属性:

<iframe src="my blog address" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="120%" width="120%"></iframe>

以下是整个页面的样子(我需要广播播放器漂浮在顶部):

<!DOCTYPE html>
<html>
<head>
</head>

<body>

<div id="radio_player">
<iframe src="http://douban.fm/partner/baidu/doubanradio" frameborder="0"></iframe>
</div>


<div id="blog_background">

<iframe src="http://swotong.com" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="120%" width="120%"></iframe>

</div>


</body>
</html>

我对在这里编码和发布问题还很陌生，感谢您的帮助。

最诚挚的问候

最佳答案

尝试将 z-index:1 添加到您想要位于顶部的框架。

您可以看到它正在运行 here

您必须使用 position 属性才能使其发挥作用。

position attributes from css3.com

关于javascript - 如何使 iframe 的 div float 在 iframe 的另一个 div 之上，该 div 应该作为页面的背景，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12665851/