Can I change or control the color of the IFRAME area before the content loads?

16,943

Solution 1

It's not too hard:

<iframe id="IFR" src="time.php" style="background-color: #f00;" />

Edit: I neglected to test in IE -- it does work in FireFox. Example at: http://beta.tagcloud.com/contain.html

The example demonstrates that the page quickly switches to all red, and then when the iframe loads (in 5 seconds), it switches to black.

Solution 2

You could perhaps set the iframe's document and set its style before loading your content.

Or you can use Ajax and not have these issues. =] (Assuming if it's appropriate for the task, of course.)

Share:
16,943
Tom Kidd
Author by

Tom Kidd

iOS developer

Updated on June 17, 2022

Comments

  • Tom Kidd
    Tom Kidd almost 2 years

    Possible Duplicate:
    fb like button creates a white background on page onload in all ie versions

    I have a site where portions of the content are loaded into IFrames.

    The problem I'm having is that the inside content of the iFrame is white until the page itself loads, and the content has a different background color (blue, in this case). So I have these white squares on the screen until the contents load.

    Is there any way to specify what color the empty IFrame should render as until it has content?

    Or am I taking the wrong tack here - is there a good way to keep the page from rendering until the contents are ready to be displayed?

    UPDATE: Looks like the "white area" bit I'm describing is IE-specific.

  • Tom Kidd
    Tom Kidd about 15 years
    Well the thing I was trying to do is load content from WordPress and then just have the client edit "pages" in WordPress without screwing up the main layout.