如何动态设置iframe大小

Question

我应该如何动态设置iframe的尺寸,因此对于不同的视口尺寸,尺寸是否灵活？

例如:

<iframe src="html_intro.asp" width="100%" height="300">
  <p>Hi SOF</p>
</iframe>

在这种情况下,高度会根据浏览器的窗口大小而有所不同.它应该根据浏览器窗口的大小动态设置.

在任何大小,iframe纵横比应该相同.如何才能做到这一点？

Answer 1

如果使用jquery,可以使用它来完成 $(window).height();

<iframe src="html_intro.asp" width="100%" class="myIframe">
<p>Hi SOF</p>
</iframe>

<script type="text/javascript" language="javascript"> 
$('.myIframe').css('height', $(window).height()+'px');
</script>

Answer 2

不太清楚300应该是什么意思？错字错字？但是对于iframe,最好使用CSS :) - 我在导入youtube视频时发现它忽略内联的东西.

<style>
    #myFrame { width:100%; height:100%; }
</style>

<iframe src="html_intro.asp" id="myFrame">
<p>Hi SOF</p>
</iframe>