コンテンツに基づいて iFrame の高さを自動的に調整するにはどうすればよいですか?

コンテンツに基づいて iFrame の高さを自動調整する

Web 開発では、Web ページに外部コンテンツを埋め込むために iFrame が使用されます。 iFrame でよく発生する問題は、iFrame 内のコンテンツに基づいて高さが動的に調整されないことです。これにより、スクロールバーが見苦しくなったり、見た目が不自然になったりする可能性があります。

質問:

スクロールバーを使用せずに、コンテンツに応じて iFrame の高さを自動的に調整するにはどうすればよいですか? ?

答え:

この目的の機能を実現するには、次の手順に従います:

1. スクリプトを追加します。 セクション:

   <script>
     function resizeIframe(obj) {
       obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
     }
   </script>

2. iFrame コードを変更します:

   <iframe src="..." frameborder="0" scrolling="no" onload="resizeIframe(this)" />

このスクリプトを組み込むことでiFrame コードを変更すると、スクロールバーを必要とせずに、iFrame に含まれるコンテンツに合わせて高さが動的に調整されます。

以上がコンテンツに基づいて iFrame の高さを自動的に調整するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。