How can I have a loading icon appear before an ifr

2019-08-01 00:13发布

问题:

I'm trying to figure out how to show a loading icon and switch to the iFrame once it's loaded. Is there some function like onclick or something?

Basically what I'm trying to accomplish is to have a div appear saying "Loading..." and once the iFrame completely loads the page show the iframe. How can this be done?

回答1:

You could set the initial frame content as just an animated gif for a loading icon and then load the actual document, separately, in an AJAX call. When the remote call completes it would replace the contents of the appropriate DOM element (e.g document.body) with the fetched page.



回答2:

I've solved this by setting an animated gif (from Ajaxload) on the iframe container's background image. The only consideration to take is that the iframe body should set a background color.

Whilst the iframe is loading, its background should be transparent and the icon should show through.