Need a simple " loading" image. (Full Version)

All Forums >> [Web Design] >> Web Graphics



Message


jrlaughlin -> Need a simple " loading" image. (6/20/2003 11:14:28)

Hello all,

I need a " loading" image to display while larger pages are loading.

Something like an animated hourglass or clock or something of the like would be great. But it has to be simple and professional looking...not tacky.

I would greatly appreciate any help.

James




abbeyvet -> RE: Need a simple " loading" image. (6/20/2003 11:32:53)

This is not really something you can do with HTML files - it is a Flash thing. Are they Flash pages?




jrlaughlin -> RE: Need a simple " loading" image. (6/20/2003 11:45:08)

no, I don' t really want a flash graphic.

I would rather have an animated gif.

I know the technology behind showing and hiding the image while the page is loading. That is not what I am asking for.

I just need a clean, 2d animated gif to display.




abbeyvet -> RE: Need a simple " loading" image. (6/20/2003 11:46:55)

quote:

I know the technology behind showing and hiding the image


Can you share that while you are waiting - I would be very interested in it for a particular page I am currently building.




jrlaughlin -> RE: Need a simple " loading" image. (6/20/2003 11:59:43)

sure...let me work something up...




jrlaughlin -> RE: Need a simple " loading" image. (6/20/2003 12:20:11)

ok...here' s how you do it.

First of all you have to be using something other than straight HTML...like ASP or JSP. This is because you are going to have to send part of the page, flush the buffer and then send the rest.

Near the top of your page, you print out a span that contains your loading message. In my case this will also contain some kind of animated gif to let the user know that " work" is going on.

<span id=" spnLoading"  style=" display:inline;" >Loading...please wait</span>


The id attribute of this span is critical as we will use it below.

Then in between the head tags of the page you put some javascript code that will execute when the page loads.
<head>
<script language=" javascript" >
		function hideLoadingMessage(){
			document.getElementById(' spnLoading' ).style.display = " none" ;
		}

</script>
</head>


Then, you have to modify your body tag to call the function when the page loads.

<body topmargin=" 0"  leftmargin=" 0"  onload=" hideLoadingMessage()" >




If you do this, the span will go away once the page is loaded.

As I said before though, you have to use this in an ASP or JSP page. This is because on the line after the <span> tag, you will have to flush the buffer to send everything to the client while the server is building the rest.

With ASP you do this by inserting this line:
<% Response.flush() %>


With JSP it is something like:
<% response.flushBuffer(); %>

I' m pretty new to JSP...so I' m not exactly sure...

This will allow the user to see that something is being done and will keep them from clicking on anything until the page is done.




abbeyvet -> RE: Need a simple " loading" image. (6/20/2003 12:42:08)

Nice - I get the concept but in my case will need to figure out what the equivalent is in PHP, I am sure there is one.....


I have had a look around for gifs - all the ones I can find are incredibly tacky.

I am rushing off now, but if you have found nothing by tomorrow I will have a go at making one for you.




jrlaughlin -> RE: Need a simple " loading" image. (6/23/2003 9:31:09)

Anyone like to help with this one?




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.046875