Web Loading Sequence

wistech

If any body can help how can control the sequence of image and text loading on browser and displaying to visitor?

I have two websites, where i want to control this sequence.

PLease help me.

MOD EDIT: E-mail address removed - don't want to be spamed, do you?! Besides, what's wrong with keeping replies here on the message board so that others may benefit from the solution(s)?

bradgrafelman

What exactly do you mean by "the sequence of image and text loading on browser" ?

Are you talking about the layout of the page?

wistech

There can be 100s of images and text pieces on a page. When a page is loaded on a browser to be shown to visitor, those images and text are loaded randomly. I want to control that.

Also if possible to show a wait screen while downloading the page contents and to load all page at once?

bradgrafelman

I think I'm understanding what you mean...

For instance, if a page has a lot of images on it, the browser will render the page once it has downloaded all of the HTML and show it to the visitor. Any images that haven't been loaded yet will (usually) have empty placeholders which display the picture once it has been downloaded.

You're saying you want to display a "Please wait..." type of screen while it is all loading, so that you can make all of the page and its contents appear at once? This sounds like something you'll need to handle with some client-side scripting (and can therefore not be 100% reliable), perhaps with something like AJAX.

Moving thread to ClientSide Technologies forum...

dougal85

You could use an absolute div and place it over the whole page. you could use something like the following CSS to do that

 #overlay{

position:absolute;
left:0px;
top:0px;
right:0px;
bottom:0px;

background-color:#fff;

 }

(not sure if that works in IE)

then on the body onload function it could disapear... you could fill that div with any loading message you want.

Although, you need a failsafe for the user not having javascript, or it will never dissapear 😛 effecively blocking the website.

oh and it looks cool if you use the CSS properly opacity 😉