Setting the loading order of page elements with CSS

Hey,

I was told I can set the load order of page elements (specific div) with CSS. How exactly is it done?

I have a few divs, one of them has a flash slideshow and the other has text=content. Obviously i would like the users to see first the text while the flash is loading.... any ideas?

Tnx for your help.

 

Load order? Uhm No. I think you mean depth sorting, in which case you need the element to either be position:relative, fixed or absolute, and use z-index.

 

My elements are positioned in a relative order. So does that mean that the first relative order will load first?

In my case the div which contains the slideshow comes first in the html, and only later do the div which contain the text appear. Is there any way I can specify for the div which contain the text not to wait till the div which contains the Flash to load?

tnx again

 

Uhm... I'm REALLY not sure what you are even saying - but I think you have it completely backwards. The only thing you can control from CSS is 'depth', aka what element appears on top of another.

Load order is determined ONLY by the order in the source code of your elements, which has nothing to do with 'positioning in relative order' or anything of that nature.

From what you are describing about waiting to load the only way I know of to do that is to dynamically load your content with javascript.

IF (and that's a big if) I understand what you are asking, it has NOTHING to do with anything CSS controls.

 

I think the elements occuring first in the code load first.

If you want to preload an image you can have it at the top of your code but with a display: hidden;, then it loads first so when you call it later in the code it's quick to display.

 

Hi Lindsey,

Are you referring to the source code order (header, menu, content, sidebars, footer) by any chance? If that's the case, then they're going to load in the order they appear in the HTML source. For example, if you have a header with a single image graphic and a CSS background, followed by a menu and a large content block containing a Flash menu, which is in turn followed by the sidebars and the footer, the header will load, followed by the menu, content, sidebars and footer. However, the text will be rendered right away, with the "included" files being loaded in the order they appear in the HTML source since they have to be fetched separately by the server.

 

Tnx alot guys,

I appreciate your help

 

hello Lindsey,
Did you get any solution for your query? I have a similar problem, I have a static html page with header, right, center and footer.
The center container contains images. I want the header and right to load before the center and then the footer to load. This way the user will not have to wait for long and can view the header and right till the images load.
Do I need to use any JS to achieve this? Please share a sample html page if you have any of this sort.
Thanks.

 

My grandfather died five years ago. Can you talk to him for me, too?