Loading script.

  • Thread starter Thread starter Curious George
  • Start date Start date
C

Curious George

I have a page that takes about 10 seconds to load the first time it is run.

I would like to first display a little animated gif telling the user that
the page is loading.

How do I do this with .NET?

I used to create a loading layer at the top of the page. Flush the layer to
the buffer.

Then I set the loading layers visibility false (with JavaScript) and
generate the page in another layer. Then flush the new HTML to the buffer.

How would I do a like thing in .NET?

George
 
Hi,

There is nothing to be done in .net , just do the same old trick :)
Create two layers, one with the loading ... message and the other with all
the page the first visible and the latter not visible, on the OnLoad event
of the Body tag invert the visibility of them and voila.


Hope this help,
 
Do I create the loading layer outside of the body?

Do I need to flush the buffer? When I tried to do it in .NET all layers
rendered at the same time.
 
Hi,

See the code below, I havent tested it, I just write it in OE.

This is the "normal" page:

<body>
<form>
</form>
</body>

this is the new page struct:
<script>
function ShowPage()
{
documents.all["preloadlayer"].style.visibility = "hidden";
documents.all["pagelayer"].style.visibility = "visible";
}
</script>

<body onLoad ="ShowPage();">
<div id="preloadlayer" name="preloadlayer" visibility="visible:visible;">
loading ...
</div>
<div id="pagelayer" id="pagelayer" style="visibility:hidden;">
<form>
</form>
</div>
</body>

Hope this help,
 
Ahh yes,

The problem is that the whole page is seams to be buffered until everything
is generated.

So you will wait for 10 seconds with a white screen and then the loading
layer will quickly flash before being made invisible and the main layer
being made visible.

I have set the buffer flag to false and tried to use Response.Flush in the
script but to no avail.

Any ideas?


example code:

Loading Report Dates...







Ignacio Machin said:
Hi,

See the code below, I havent tested it, I just write it in OE.

This is the "normal" page:

<body>
<form>
</form>
</body>

this is the new page struct:
<script>
function ShowPage()
{
documents.all["preloadlayer"].style.visibility = "hidden";
documents.all["pagelayer"].style.visibility = "visible";
}
</script>

<body onLoad ="ShowPage();">
<div id="preloadlayer" name="preloadlayer" visibility="visible:visible;">
loading ...
</div>
<div id="pagelayer" id="pagelayer" style="visibility:hidden;">
<form>
</form>
</div>
</body>

Hope this help,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

Curious George said:
Do I create the loading layer outside of the body?

Do I need to flush the buffer? When I tried to do it in .NET all layers
rendered at the same time.


with
all
Click to expand...
Click to expand...
 
Sorry example would not render inline.


Curious George said:
Ahh yes,

The problem is that the whole page is seams to be buffered until everything
is generated.

So you will wait for 10 seconds with a white screen and then the loading
layer will quickly flash before being made invisible and the main layer
being made visible.

I have set the buffer flag to false and tried to use Response.Flush in the
script but to no avail.

Any ideas?


example code:

Loading Report Dates...







Ignacio Machin said:
Hi,

See the code below, I havent tested it, I just write it in OE.

This is the "normal" page:

<body>
<form>
</form>
</body>

this is the new page struct:
<script>
function ShowPage()
{
documents.all["preloadlayer"].style.visibility = "hidden";
documents.all["pagelayer"].style.visibility = "visible";
}
</script>

<body onLoad ="ShowPage();">
<div id="preloadlayer" name="preloadlayer" visibility="visible:visible;">
loading ...
</div>
<div id="pagelayer" id="pagelayer" style="visibility:hidden;">
<form>
</form>
</div>
</body>

Hope this help,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

Curious George said:
Do I create the loading layer outside of the body?

Do I need to flush the buffer? When I tried to do it in .NET all layers
rendered at the same time.


"Ignacio Machin" <ignacio.machin AT dot.state.fl.us> wrote in message
Hi,

There is nothing to be done in .net , just do the same old trick :)
Create two layers, one with the loading ... message and the other with
all
the page the first visible and the latter not visible, on the OnLoad event
of the Body tag invert the visibility of them and voila.


Hope this help,

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation

I have a page that takes about 10 seconds to load the first time
Click to expand...
Click to expand...
it
is
Click to expand...
Click to expand...
 
Hint

It got nothing to do with .Net, so it isn't the good place for it.

There are several ways of doing it but the best one, in my experience is the
following:
Make two frames. One with content (fContent), one with "loading" gif and
text (fLoading).
Anytime you have a submit/redirect button/link clicked make fContent 0%
height and the fLoading 100%
After each Body.onload event make fContent 100% and fLoading 0%.
Advantages:
The fLoading shows before the submit, so the time passed from submit to the
beginning of data receiving from the server the browser will display
fLoading
Even if you have redirections, or whatever, it won't flicker.
The next page will be displayed only when the page is fully loaded (after
Body.onload event occured)
 
Thank you. I am sure that the below suggestion will work and it looks to be
the way to go.

I would still be interested in getting the answer to my dot net question
though.

It is:
Can one flush half a page to the browser before the rest of the page is
generated.
Is all code from the page behind dirivitive done before the script in the
..aspx?
 
Back
Top