读书人

jQuery,js兑现Iframe自适应高度(兼容多

发布时间: 2012-11-23 00:03:29 作者: rapoo

jQuery,js实现Iframe自适应高度(兼容多浏览)
// 我们在aa.html里面有个iframe,加载内容为bb.html

<iframe id="frame_con" src="bb.html" frameborder=0 scrolling=no style="margin-left:0px;margin-top:-3px;width:785px;height:550px;float:right;"></iframe>


方式一
//引入jQuery<script src="http://res.func.fetionpictest.com/js/public/jquery-1.3.2.min.js?2011122701" type="text/javascript"></script><script type="text/javascript">          //document.domain = "fx-func.com";//指向根域         $(window.parent.document).find("#frame_con").load(function(){//绑定事件         var main = $(window.parent.document).find("#frame_con");//找到iframe对象         var thisheight = $(document).height()+30;//获取页面高度         main.height(thisheight < 500 ? 500 : thisheight);//为iframe高度赋值如果高度小于500,则等于500,反之不限高,自适应                });     </script>


方式二
$("#frame_con").load(function(){    var thisheight = $(this).contents().find("body").height()+30;    $(this).height(thisheight < 500 ? 500 : thisheight);});

读书人网 >JavaScript

热点推荐