Setting iFrame CSS to display:none during load

Question

I have this:

<div class="upload_slide">
    <iframe class="upload_iframe" style="visibility:hidden;"></iframe>
</div>

If I then post some files to the iFrame and set .upload_slide to display:none;, while it's loading, will this affect the loading of the iFrame or the detection of when it finished loading?

Answer 1

No, the iFrame's loading and load detection should not be compromised by setting the display to none.

CSS is just for style, it has no ability to affect the DOM.

Answer 2

There shouldn't be a problem but if there is, a good trick can be to move the element offscreen rather than hiding it. You can create a class like

.offscreen{
    position: absolute;
    left: -5000px;
}

which you can add and remove as needed.