javascript 如何在不隐藏主体的情况下将 iframe 绝对放在顶部
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7495277/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to put an iframe absolutely on top without concealing the body
提问by kamikaze_pilot
so I have an iframe:
所以我有一个 iframe：
<iframe style="width:100%;height:45px;position:fixed;top:0px;left:0px;z-index:2147483649" src="etc" scrolling="no" frameborder="0px"></iframe>
but then this iframe would conceal the top portion of the body contents since this iframe will be over the body contents....is there a way to configure this iframe with html, javascript, etc so that it wouldn't conceal the body anymore (no dirty jokes plz)
但是这个 iframe 会隐藏正文内容的顶部，因为这个 iframe 将覆盖正文内容......有没有办法用 html、javascript 等配置这个 iframe，这样它就不会再隐藏正文了（请不要开肮脏的笑话）
EDIT
编辑
also I'm trying to get it to not scroll down and will always be absolutely on the top of the page even when the user scrolls the page down...but doing so without covering the body contents...think of a toolbar
我还试图让它不向下滚动，即使用户向下滚动页面，它也将始终绝对位于页面顶部......但这样做时不会覆盖正文内容......想想工具栏
回答by Ujjwal Manandhar
i think changing the css positionto relativewill do that
我想改变的CSSposition来relative将这样做
<iframe style="width:100%;height:45px;position:relative;top:0px;left:0px;z-index:2147483649" src="etc" scrolling="no" frameborder="0px"></iframe>
check the working code @here
在此处检查工作代码@
so you want the fixed iframe that will always reside at top. For that you need to set the
margin-topto body. the margin will be greater than the height of the iframe.
see the updated fiddle
@here
所以你想要固定的 iframe 总是位于顶部。为此，您需要将 to 设置
margin-top为 body。边距将大于 iframe 的高度。在这里查看更新的小提琴@
回答by Jan Pfeifer
Wrap your body content within a DIV and position it under the iframe.
将您的正文内容包裹在 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>
回答by Scott Evernden
not sure what you are trying to do necessarily but if you change 'position' to 'static' and stop trying to position it absolute, then local elements will flow under it ..
不确定您要做什么，但如果您将“位置”更改为“静态”并停止尝试将其绝对定位，那么局部元素将在其下方流动..
otherwise you need to add some margin above what you don't want concealed
否则，您需要在不想隐藏的内容上方添加一些边距
