Question

我在iframe中有一个div。我的问题是，当div打开时，由于iframe的宽度限制，其内容不会完全显示。我尝试使用z-index并为iframe中的div设置了更高的z-index值，但没有成功。任何建议都非常感谢。谢谢！

Answer 1

您不能将内容溢出iframe的边界。因此，overflow和z-index属性不能用于让某些元素流出iframe。

你需要增加框架的宽度或者根本不使用iframe;例如，通过AJAX加载内容并将其插入到文档的另一个元素中。

Answer 2

您可以在加载内容时自动调整iframe的大小：

<script type="text/javascript">
  function autoResize(id){
    var height = document.getElementById(id).contentWindow.document.body.scrollHeight;
    var width = document.getElementById(id).contentWindow.document.body.scrollWidth;

    document.getElementById(id).height= (height) + "px";
    document.getElementById(id).width= (width) + "px";
  }
</script>

<iframe src="yourpage.html" id="yourframe" onLoad="autoResize('yourframe');"></iframe>

Answer 3

你试过使用div的绝对位置吗？类似的东西：

.div-overlay {
    position:absolute;
    top:200px;
    left:100px;
 }

Answer 4

这可能是因为iframe

中的框体边距使用margin:0

html,body {margin:0px; padding:0px}   //use this in  iframe css

由于iframe边距，iframe内部的Div不完全可见

4 个答案: