jqueryかどうか/クロスブラウザ互換iframeのサイズ変更（IE、Chrome、Safari、Firefox）

ここは私の問題です。私は十字ブラウザのiframeリサイズコードを使用するために懸命に探していて、私はちょうど1つを見つけることができません。私が見たすべては、あるブラウザでは別のものよりも問題があります。ここに私がやっていることがあります。 jQueryツールオーバーレイのページにiframeを読み込んでいます。このiframeはページの内容を読み込みます（同じドメイン上ではクロスドメインについて心配する必要はありません）。ユーザーがそのフォーム上のアクションをクリックすると、iframeのサイズを変更する必要があります（iframeが増加したときには機能していますが、iframeが減少したときには機能しません）。jqueryかどうか/クロスブラウザ互換iframeのサイズ変更（IE、Chrome、Safari、Firefox）

私はその後、機能この機能

$(window).load(function(){ 
    parent.adjust_iframe(); 
});

は親ページがそうのような関数を呼び出していiframe内に含まれているのjsファイルを持っている：

function adjust_iframe() { 

    //i have tried both body and html and both dont work in IE 
    var h = $("#overlayFrame").contents().find("body").height(); 
    if(h==0) 
    h="500"; 
    else 
    h=h+3; 

    $("#overlayFrame").css({'height': h}); 
    window.scrollTo(0,0); 

}

上記のコードがで正常に動作しますクロームとFirefoxはIEではない。

ここにヘルプがありますか？私は実際には、サポートされていないいくつかの重いjqueryプラグインを含んでいないクロスブラウザ互換の軽量ソリューションが必要です。

ありがとうございます！

あなたを：

出典

2012-03-26 Scoota P

が

$(window).load(function(){ 
    var bodyHeight = $('body').height(); 
    parent.adjust_iframe(bodyHeight); 
});

と

function adjust_iframe(newHeight) { 

    //i have tried both body and html and both dont work in IE 
    if(newHeight == 0) { 
     newHeight = 500; 
    } else { 
     newHeight += 3; 
    } 

    $("#overlayFrame").css({'height': newHeight}); 
    window.scrollTo(0,0); 
}

問題は、ページは、アイフレームの内容にアクセスすることができないということはおそらくですので...

出典

2012-03-26 19:24:54

を試してみて、私は2つの提案を持っていますCSSの高さを設定しています。明示的にピクセルを指示します。

$("#overlayFrame").css({'height': h + 'px'});

iframeコードがparent.adjust_iframeを呼び出すときは、現在の幅/高さを送信します。

parent.adjust_iframe($('body').height());

BONUSの提案：少し調査し、IEのバージョンと動作しない理由を教えてください。いくつかの警告をそこに入れて、高さが派生しているかどうか調べてください。

出典

2012-03-26 19:25:59

私は警告を出し、IE8で私は高さが150であることを警告します。これは調整前のiframeの元のサイズです –

-1

私はアーカイブファイルを探して、iframeウィンドウの新しいサイズを設定するスクリプトを見つけました。それはIE6、FF、で働いていた...

/** 
* Parent 
*/ 
<iframe id="myframe" name="myframe" ...> 

<script type="text/javascript"> 
var iframeids=["myframe"]; 
if (window.addEventListener) { 
    window.addEventListener("load", resizeCaller, false); 
}else if (window.attachEvent) { 
    window.attachEvent("onload", resizeCaller); 
} else { 
    window.onload=resizeCaller; 
} 
var iframehide="yes"; 
var getFFVersion=navigator.userAgent.substring(navigator.userAgent.indexOf("Firefox")).split("/")[1]; 
var FFextraHeight=parseFloat(getFFVersion)>=0.1? 20 : 0; 
function resizeCaller() { 
    var dyniframe=new Array(); 
    for (i=0; i<iframeids.length; i++){ 
    if (document.getElementById) 
     resizeIframe(iframeids[i]); 
    if ((document.all || document.getElementById) && iframehide=="no"){ 
     var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i]); 
     tempobj.style.display=""; 
    } 
    } 
}; 

function resizeIframe(frameid){ 
    var currentfr=document.getElementById(frameid); 
    if (currentfr && !window.opera){ 
    currentfr.style.display=""; 
    if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) 
     currentfr.height = currentfr.contentDocument.body.offsetHeight+FFextraHeight; 
    else if (currentfr.Document && currentfr.Document.body.scrollHeight) 
     currentfr.height = currentfr.Document.body.scrollHeight; 
    if (currentfr.addEventListener) 
     currentfr.addEventListener("load", readjustIframe, false); 
    else if (currentfr.attachEvent){ 
     currentfr.detachEvent("onload", readjustIframe); 
     currentfr.attachEvent("onload", readjustIframe); 
    } 
    } 
}; 
function readjustIframe(loadevt) { 
    var crossevt=(window.event)? event : loadevt; 
    var iframeroot=(crossevt.currentTarget)? crossevt.currentTarget : crossevt.srcElement; 
    if (iframeroot)resizeIframe(iframeroot.id); 
}; 

function loadintoIframe(iframeid, url){ 
    if (document.getElementById)document.getElementById(iframeid).src=url; 
}; 
</script> 

/** 
* child iFrame html 
*/ 
<body onResize="resizeIE()">

出典

2012-03-26 19:28:48 JercSi

jqueryかどうか/クロスブラウザ互換iframeのサイズ変更（IE、Chrome、Safari、Firefox）

答えて

関連する問題