iframeが完全に読み込まれる前にローディングアイコンを表示させるにはどうすればよいですか？

Question

ロードされたアイコンを表示し、ロードされたiFrameに切り替える方法を理解しようとしています。 onclickのような機能がありますか？

基本的に私が達成しようとしているのは、「読み込み中...」と表示されたdivを表示し、iFrameがページを完全に読み込んだ後にiframeを表示することです。これはどうすればできますか？

Answer 1

ローディングアイコンのアニメーションGIFとして初期フレームのコンテンツを設定してから、実際のドキュメントをAJAX呼び出しで個別に読み込むことができます。リモート呼び出しが完了すると、適切なDOM要素の内容（例えば、document.body）がフェッチされたページに置き換えられます。

Answer 2

iframeコンテナの背景画像にアニメーションgif（Ajaxload）を設定することでこれを解決しました。考慮する必要があるのは、iframe本体が背景色を設定する必要があることだけです。

iframeは読み込み中ですが、その背景は透明で、アイコンが表示されるはずです。