iframeを高さに適応させる方法の説明

なぜ iframe アダプティブ高さを使用する必要があるのですか?実際、これは見た目を美しくするためだけです。そうしないと、iframe とウィンドウの長さとサイズが異なり、常に不快に見えます。特にプログラマーにとっては、喉にしこりのように感じられます。 。 iframe を介して別のページがページに埋め込まれた後、くだらない上下左右のスクロール バーを表示せずに、ページのこの領域を iframe の高さに自動的に適応させるにはどうすればよいでしょうか?次の方法は、JavaScript を使用して適応性の高い iframe を実現する方法です。これは、IE、Firefox、Chrome、Opera、Safari などのすべてのブラウザーで適応性の高い iframe を実現できます。

具体的な使用方法は以下の通りです(iframe内のコンテンツの高さに合わせてid=phpernoteでiframeの高さを設定します):

function dyniframesize(down){
var Sys={};
var ua=navigator.userAgent.toLowerCase();
var s;
(s=ua.match(/msie ([\d.]+)/))?Sys.ie=s[1]:
(s=ua.match(/firefox\/([\d.]+)/))?Sys.firefox=s[1]:
(s=ua.match(/chrome\/([\d.]+)/))?Sys.chrome=s[1]:
(s=ua.match(/opera.([\d.]+)/))?Sys.opera=s[1]:
(s=ua.match(/version\/([\d.]+).*safari/))?Sys.safari=s[1]:0;
var pTar=null;
if (document.getElementById){
pTar=document.getElementById(down);
}else{
eval('pTar='+down+';');
}
pTar.style.display="block";
if (Sys.ie){
if(Sys.ie=='9.0'){
pTar.height=pTar.contentWindow.document.body.offsetHeight+15+"px";
pTar.width=pTar.contentWindow.document.body.scrollWidth+"px";
}else if(Sys.ie=='8.0'){
pTar.height=pTar.Document.body.offsetHeight+15+"px";
pTar.width=pTar.Document.body.scrollWidth+"px";
}else{
pTar.height=pTar.Document.body.scrollHeight+25+"px";
pTar.width=pTar.Document.body.scrollWidth+"px";
}
}
if (Sys.firefox){
pTar.height=pTar.contentDocument.body.offsetHeight+15+"px";
pTar.width=pTar.contentDocument.body.scrollWidth+"px";
}
if (Sys.chrome){
pTar.height=pTar.contentDocument.body.offsetHeight;
pTar.width=pTar.contentDocument.body.scrollWidth;
}
if (Sys.opera){
pTar.height=pTar.contentDocument.body.offsetHeight;
pTar.width=pTar.contentDocument.body.scrollWidth;
}
if (Sys.safari){        
if(pTar.contentDocument.body.offsetHeight <= &#39;186&#39;){
pTar.height=pTar.contentDocument.body.offsetHeight+10;
}else{
pTar.height=pTar.contentDocument.body.offsetHeight;
}
pTar.width=pTar.contentDocument.body.scrollWidth;
}
}

前回の記事では

iframe属性の使い方を紹介しましたが、この記事では、iframe の高レベルのソリューションを適応させる方法についても説明します。これら 2 つの記事が iframe タグについての理解を深めることを願っています。

関連する推奨事項:

iframe属性の使い方

phpにおけるmainとiframeの相互通信の詳しい説明

phpフォームファイルiframe非同期アップロードチュートリアルの説明

iframeタグの共有注意問題点

HTML iframe の使用に関する実用的な概要を共有します

以上がiframeを高さに適応させる方法の説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。