我正在尝试使用javascript调整网站上iframe的大小,以便iframe与内部内容一样长。我的代码如下:
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';
}
}
console.log( 'resize frame before' );
if ($.browser.safari || $.browser.opera) {
console.log( 'if' );
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 {
console.log( 'else' );
$( '.iframe' ).load(function() {
console.log( 'load' );
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
}
console.log( 'resize frame end' );
它不起作用,但是使用console.log时,唯一没有出现的日志是在'load'函数内。
我正在调用页面底部的所有javascript,我不确定是否会导致问题。
任何帮助都会有很大帮助。
修改:源代码位于https://github.com/xonorageous/projet-sas 可以在http://daniel-lucas.com/experiments-dir/projet-sas/
查看网站答案 0 :(得分:1)
你可以在jQuery中轻松实现这一点:
$(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';
});
}
});
在此处查看原始来源&gt; http://css-tricks.com/snippets/jquery/fit-iframe-to-content/