Question

我有一个模式，我想根据iframe内容大小调整大小。

我可以使模态变大，但iframe的内容仍然带有滚动条。

这是github页面的链接。点击模态＆＃34;一分钟故事＆＃34;链接在左上角。

我希望模态完全居中，iframe内容是一个svg图表，在没有卷轴的情况下完美地进入其中。

<div id="story-modal" class="modal hide fade" >
  <div class="modal-header">
        <a href="#" class="close">&times;</a>
        <h3>1 Minute Story!</h3>
      </div>

    <div id="storyChart" >

    </div>
<script type="text/javascript">$("#storyChart").append($("<iframe />").attr("src", "/frame.html"));
</script>

</div>

Answer 1

放下以下代码

#story-modal {
height: 500px;
width: 590px;
}
#storyChart {
height: auto;
width: 100%;
position: relative;
overflow-y: hidden;
overflow-x: hidden;
}
Put this code in iframe
<iframe src="/frame.html" width="200" height="200" style="
    width: 100%;
    height: 520px;"></iframe>

对于h1，写入了一些宽度，因为水平滚动即将到来

.container h1{
width: 100%;
position: relative;
/* left: -100px; */
letter-spacing: -1px;
line-height: 60px;
font-size: 60px;
font-weight: 100;
margin: 0px 0 50px 0;
text-shadow: 0 1px 0 #fff;
}

它可以正常使用此更改

根据iframe内容调整模式大小

1 个答案: