如何在不隐藏身体的情况下将iframe绝对放在上面

时间:2011-09-21 06:08:36

标签: javascript jquery html css iframe

所以我有一个iframe:

<iframe style="width:100%;height:45px;position:fixed;top:0px;left:0px;z-index:2147483649" src="etc" scrolling="no" frameborder="0px"></iframe>

但是这个iframe会隐藏正文内容的顶部部分,因为这个iframe将覆盖正文内容....有没有办法用html,javascript等配置这个iframe,这样它就不会隐藏身体了(没有肮脏的笑话PLZ)

修改

我也试图让它不向下滚动,即使用户向下滚动页面也总是绝对位于页面顶部...但这样做却没有覆盖身体内容...想到工具栏

3 个答案:

答案 0 :(得分:1)

我认为将css position更改为relative会这样做

 <iframe style="width:100%;height:45px;position:relative;top:0px;left:0px;z-index:2147483649" src="etc" scrolling="no" frameborder="0px"></iframe>

检查工作代码@ here

因此您需要始终位于顶部的固定iframe。为此你需要设置 身体margin-top。边距将大于iframe的高度。 看到更新的小提琴  @ here

答案 1 :(得分:1)

将您的身体内容包裹在DIV中并将其放置在iframe下。

<iframe style="height:45px;position:absolute;top:0px;left:0px;" src="etc" scrolling="no" frameborder="0px"></iframe>

<div style='position:absolute;left:0;right:0;top:45px;bottom:0;overflow:auto;'>Your body content</div>

答案 2 :(得分:0)

不确定你要做什么,但如果你将'position'改为'static'并停止尝试将其置于绝对位置,那么本地元素将在它下面流动..

否则你需要在你不想隐藏的东西之上加上一些余量