/    Sign up×
Community /Pin to ProfileBookmark

How to show a hourglass mouse icon

Copy linkTweet thisAlerts:
Oct 31.2003

Hi y’all JS gurues ?

I’m trying to change the mouse icon while a task is processing (in order for the user to know that the process is “working”…) but the task begins and ends … and the mouse icon is not changing.

Is there anyway to “synchronize” the two events? (changing the mouse icon and performing the task) so when the task begins, to change mouse icon from “default” to “hourglass”; and when the task ends, to change mouse icon from “hourglass” to “default”.

If you have a li’l sample code about this issue, pls be kind and share it with me.

Thanx in advance.

to post a comment
JavaScript

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@fredmvOct 31.2003 — I believe this is IE-only, but this is what you're looking for:<body style="cursor: wait;">I hope that helps you out.
Copy linkTweet thisAlerts:
@yphasukyuedNov 26.2003 — How to change it back to default after the page was loaded?
Copy linkTweet thisAlerts:
@PittimannNov 26.2003 — Hi!

I'm also quite sure, that this works for IE only.

To change it back using fredmv's example, use this:

<body style="cursor: wait;" onload="document.body.style.cursor='default';">

Cheers - Pit
Copy linkTweet thisAlerts:
@fredmvNov 26.2003 — Or:&lt;body style="cursor: wait;" onload="style='cursor: default';"&gt;
Copy linkTweet thisAlerts:
@yphasukyuedMar 03.2004 — I have to get rid of ";" and the it worked.

Original code:

style="cursor: wait;" onload="document.body.style.cursor='default';">

Changed to:

<BODY style="cursor: wait" onload="document.body.style.cursor='default'">

Is any way we can put customize animate gif instead of HOUR GLASS?

Thanks

Yut
Copy linkTweet thisAlerts:
@AdamGundryMar 03.2004 — I'm not sure if you can use GIFs, or whether you need to use CUR files - try it and see (this will first try to load myCursor.gif, then noGifCursor.cur, and if that fails use the hourglass):

style="cursor: url(myCursor.gif), url(noGifCursor.cur), wait"

See the [url=http://www.w3.org/TR/CSS2/ui.html#propdef-cursor]CSS specification[/url].

Adam

P.S. This is not IE-only, it should work in any CSS2-compliant browser.
Copy linkTweet thisAlerts:
@yphasukyuedMar 04.2004 — Thanks AdamGundry, I will try it.

Yut
×

Success!

Help @Caliban spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.21,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...