cursor to hour glass

AndyApp · Nov 1, 2002

Hi,

Is there a way to change a users cursor to the hour glass everytime my page starts to load? All users will only be using IE6 and the page calls numerous functions that cause the page to refresh or reload.

If they interrupt the process by selecting a different drop down before the page has reloaded it can cause all sorts of problems.

The solution in vbscript would be ideal.

Thanks. "Life is like a Ferrari, it goes to fast.
But that's ok, because you can't afford it anyway" - Jim Davis (Garfield)

krisbrixon · Nov 1, 2002

I have never looked into the mouse thing, but you could take them to a sub page that is lacking all the buttons/drop downs and that loads fast. Once you are at the subpage then run the functions that take awhile.

Kris
- It is simple to make something complex, and complex to make it simple.

Tarwn · Nov 1, 2002

In order to process anything on the page before the script has finished on the server you will need to first set the Response.Buffer = False.
Then you could have the first thing written be a javascript to change the page's CSS attribute for the mouse icon. Then in the body onload you could change it back...or:

Similar thing, but create a 1x1 transparent(or a loading image) image. Output the image before you get to the heavy processing portion of your code, give it a width and height of bunches and lots (to cover the whole screen), absolute positioning, and a z-index high enough to cover all the components on the screen. Then in the onLoad event have it turn the display attribute of the image to none

Code:

<%
Option Explicit

Response.Buffer = False
%>
<html>
<head>
</head>
<body onLoad=&quot;document.getElementById('pageLoadImg').style.display='none';&quot;>
<img id=&quot;pageLoadImg&quot; style=&quot;width:2000px;height:2000px;position:absolute;z-index:500;cursor:wait&quot; src=&quot;myLoadingImage.gif&quot;>
<%
'rest of heavyt processing ASP here
%>
</body>
</html>

This is on the fly, but that should layer the loading image over everything else on the page until the entire page has loaded, making it disappear. I also added the cursor:wait; attribute to it so you would also get the hourglass cursor, since this is set only on the img tag, when the image disappears the cursor should revert to standard.

-Tarwn --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- ---
For my next trick I will pull a hat out of a rabbit (if you think thats bad you should see how the pigeon feels...)

AndyApp · Nov 1, 2002

Tarwn

that's the closet to what I want that anyone has said so far but still not quite. I need that to happen as soon as a drop down has changed but can't get it to fire the javascript.

Think i'll just tell them no.

Thanks,
Andy "Life is like a Ferrari, it goes to fast.
But that's ok, because you can't afford it anyway" - Jim Davis (Garfield)

GabeC · Nov 1, 2002

It is great you have a limited browser audience. This makes things much easier.

One aspect of programming for the web that most developers have forgotten or never learned is to not let the user have access to anything until it is appropriate. For example, in Windows when you change a setting, the "Apply" button isn't activated until you change data. The user shouldn't have access to the "Apply" button if nothing has changed because it isn't relevant.

In the same manner, your users shouldn't have access to dropdown boxes until they are fully populated.

You could wrap the form and all its input fields in a <DIV> tag that is hidden until all processing has completed. Once the processing is completed, change the <DIV> tag to visible. You could also have a second <DIV> tag that says something like "Loading Data. Please wait...” that you toggle on and off also.

Another solution is to "disable" all the form input fields until processing is completed and then change them to be enabled.

We use both these methods often. If you use the onChange method of a dropdown box, you could disable all affected input fields until the processing is completed then enable them again.

Thanks,

Gabe

Tarwn · Nov 1, 2002

If you use the idea I provided above and include it in the calling page as well, you could have the form tags that are being submitted have an onSubmit event to change the display back to inline:

Code:

<form method=POST action=&quot;whatever.asp&quot; onSubmit=&quot;document.getElementById('pageLoadImg').style.display='inline';&quot;>

thus placing the transparent image back on top of everything while waiting for the next page to put it's own image on top when it loads.

-Tarwn --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- ---
For my next trick I will pull a hat out of a rabbit (if you think thats bad you should see how the pigeon feels...)

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

cursor to hour glass

AndyApp

Programmer

krisbrixon

Programmer

Tarwn

Programmer

AndyApp

Programmer

GabeC

Programmer

Tarwn

Programmer

Similar threads

Part and Inventory Search

Sponsor