この記事では、IFRAME適応高さを実装するJSの方法について説明します。次のように、参照のために共有してください。
私は以前にIFRAMEの高レベルの適応性に悩まされてきましたが、多くのJSコードはFFで馬鹿げているようです。その後、FFと互換性があると主張する数千のコード山から、次のコードが最終的に私によって取得されました。私はそれを使用しました、それは本当に使いやすいです。特に、JSのレベルが低い(私はとても恥ずかしい)私のような人々にとって、このコードは簡単で理解しやすく、変更するのに便利です。次のコードをコピーして貼り付けて、iframeが配置されているページの<body>タグに貼り付けて、ID名を変更します(変更する場所が2つあり、場所がコードで説明されていることに注意してください)。
このコードを作成した友人に敬礼します。
ステップ1:<body>タグの下に次のJSコードを入力します
<scriptlanguage = "javascript"> function adachframesize(){var frm = document.getElementById( "iframe1"); // iframe1をid name var subweb = document.framesに置き換えますか? document.frames ["iframe1"]。document:frm.contentdocument; if(frm!= null && subweb!= null){frm.style.height = "0px"; //初期化します。 frm.style.width = subweb.documentelement.scrollwidth+"px"; subweb.body.style.overflowx = "auto"; subweb.body.style.overflowy = "auto"; }} </script>ステップ2:id = "iframe1" onload = "adachframesize()"をiframeタグに追加します
例:コピーコードは次のとおりです。
このコードにはわずかな欠点があります。つまり、iframeのコンテンツと外側の境界の間の距離(外側の境界が存在する場合)は少し小さいため、自分で適切に調整できます。さらに、IE6.0以外およびFFを除いて他のブラウザはテストされておらず、他の欠陥は見つかりませんでした。使用中に問題が見つかった場合や、より良い解決策がある場合は、共有してください。
IFRAMEページにAjax-Loadedページが含まれている場合、またはJSを介してコンテンツを動的に追加する場合、次の方法を追加できます。
1:次のコンテンツをサブページに追加します
//親のウィンドウアドレスを変更する機能changeheight(){window.top.location.hash = "#height =" + $(document).height();}DOMの部分を変更してこのメソッドを呼び出す
2:親ページを追加します
// height adaptive var iframe = document.getElementById( "iframe1"); function iframeheight(){var hash = window.location.hash.slice(1)、h; if(hash && /height=/.test(hash)){h = hash.replace( "height ="、 ""); iframe.style.height = h+"px"; window.location.hash = "#temp"; //他のページをクリックすると、高さが変更されないようにします} setimeout(iframeheight、100);} iframeheight();JavaScript関連のコンテンツの詳細については、このサイトのトピックをご覧ください:「JavaScriptのJSON操作手法の要約」、「JavaScriptの切り替え効果と技術の要約」、「JavaScript検索アルゴリズム技術の要約」、「Javascriptアニメーション効果と技術の要約」、「Javascriptのアニメーション効果と技術の要約」、「Javascript Animation Efters」の概要「要約」、「Javascriptの概要」、「要約」、「要約の要約」データ構造とアルゴリズム手法 "、「javascriptトラバーサルアルゴリズムと手法の要約」および「Javascriptの数学操作の使用法の要約」
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。