[解決済み] iframeの幅と高さをコンテンツに合わせて調整する
2022-03-14 06:21:35
質問
を解決する必要があります。
自動調整
は
width
と
height
の
iframe
を使用して、そのコンテンツにかろうじて適合するようにします。ポイントは、幅と高さを変更できるのは
iframe
が読み込まれました。私は、iframeに含まれるボディの寸法の変化に対応するイベントアクションが必要なのだと思います。
解決方法は?
<script type="application/javascript">
function resizeIFrameToFitContent( iFrame ) {
iFrame.width = iFrame.contentWindow.document.body.scrollWidth;
iFrame.height = iFrame.contentWindow.document.body.scrollHeight;
}
window.addEventListener('DOMContentLoaded', function(e) {
var iFrame = document.getElementById( 'iFrame1' );
resizeIFrameToFitContent( iFrame );
// or, to resize all iframes:
var iframes = document.querySelectorAll("iframe");
for( var i = 0; i < iframes.length; i++) {
resizeIFrameToFitContent( iframes[i] );
}
} );
</script>
<iframe src="usagelogs/default.aspx" id="iFrame1"></iframe>
関連
-
jsを使った簡単な照明スイッチのコード
-
Vueにシンプルなメモ帳機能を実装
-
[解決済み】リソースの読み込みに失敗した:Bind関数でサーバーが500(Internal Server Error)のステータスで応答した【非公開
-
[解決済み】TypeErrorの解決方法。未定義またはヌルをオブジェクトに変換できない
-
[解決済み】 `string.split is not a function` というエラーの原因は何ですか?
-
[解決済み] HTML要素の実際の幅と高さを取得するにはどうすればよいですか?
-
[解決済み] 残りの幅を埋めるためにdivを展開する
-
[解決済み] コンテンツに応じたiframeのサイズ変更
-
[解決済み] CSSで背景画像を幅に合わせ、高さは比例して自動縮小する
-
[解決済み】Divの高さが100%で、コンテンツに合わせて拡大される。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
JSクロスドメインソリューション リアクト構成 リバースプロキシ
-
jsを使った簡単な照明スイッチのコード
-
WeChatアプレット用ユニアプリによるグローバルシェアリング
-
HTML+CSS+JavaScriptで簡単な三目並べゲームを作成する。
-
VUEグローバルフィルターの概念と留意点、基本的な使い方
-
[解決済み】TypeError: Router.use() はミドルウェアの関数を要求しているが、Object を取得した。
-
JavaScriptのgetElementById()メソッド入門
-
[解決済み] jquery - is not a function エラー
-
[解決済み] スクロールバーを使わずに、iframeの高さをコンテンツに合わせて自動的に調整する?重複
-
[解決済み】フルスクリーンiframeの高さが100%になる件