读书人

关于iframe的高度自适应有关问题

发布时间: 2012-10-30 16:13:36 作者: rapoo

关于iframe的高度自适应问题

/* *比如有两个页面a.html 和b.html *我们要做的是在a.html里面的iframe里面引入b.html,b.html里面的实际内容高度有多少,a.html里面的iframe的高度就有多少, *随着b.html里面的高度的变化 iframe的高度也在自适应的变化 */ 1.首先我们先来看a.html <html>       <head>           <script type="text/javascript" src="....这里引入的我就不写了">                 //这里我用jQuery来取得iframe的src                 jQuery(document).ready(function(){                         document.all.thisIframe.src = "b.html";                 });           </script>       </head>       <body>            <!--这里我们不在iframe里面写src,我们要让被引入的html先进行编译,要不我们会得不到被引入html的高度,我们可以用js或者用jQuery写一个方法得到src             -->            <iframe height="100%" width="100%" scrolling="no" frameborder="0" name="thisIframe" id="thisIframe">            </iframe>       </body> </html> 2.我们来看在b.html里面要加些什么 <html>      <head>      </head>      <!--请看好在body里面写了什么东西,下面的thisIframe代表iframe的id,下面的form1代表这个html的form的id 一般的我们引入的html都会有一个form,获得body的高度往往不准确,这里我们直接获取form的实际内容的高度  --->      <body onload="parent.window.document.all.thisIframe.height=document.form1.scrollHeight">           <form id="form1" action="">                <table>                </table>           </form>      </body> </html> 3.往往这样的话我们就可以在a.html里面的主页面里面看到iframe的高度随着b.html里面的实际内容高度自适应的变化  

?

读书人网 >Web前端

热点推荐