现在的位置: 首页 > 综合 > 正文

动态调整Iframe以适应内容(仅同域)

2013年03月23日 ⁄ 综合 ⁄ 共 802字 ⁄ 字号 评论关闭

     通常情况下,您设置和宽度Iframe和高度。如果里面的内容比较大,滚动就够了。下面的脚本试图修复,动态调整iframe来适应它加载的内容

 

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script>
<script type='text/javascript'>

$(function(){

var iFrames = $('iframe');

function iResize() {

for (var i = 0, j = iFrames.length; i < j; i++) {
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
}

if ($.browser.safari || $.browser.opera) {

iFrames.load(function(){
setTimeout(iResize, 0);
});

for (var i = 0, j = iFrames.length; i < j; i++) {
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}

} else {
iFrames.load(function() {
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
}

});

</script>


调整这样一个iframe

 

 

 

<iframe src="content.html" class="iframe" scrolling="no" frameborder="0"></iframe>


抱歉!评论已关闭.