Changing mouse into hourglass over all objects including drop downs

M

mcraven.2

I know this works on all objects except drop down boxes.

doc = document.all
for (i=0;i<doc.length;i++)
{
doc(i).style.cursor = 'wait';
}

Is it possible to make a cursor into an hourglass over a drop down?
 
R

RobG

I know this works on all objects except drop down boxes.

doc = document.all
Click to expand...

document.all is a proprietary MS feature that has been copied to some
extent by other browsers, but can be considered deprecated (since IE 5)
in favour of appropriate W3C standards - in this case,
document.getElementsByTagName should do the trick but may not be necessary.

Using script to do style stuff is clumsy and should really only be done
where there is no other way.

for (i=0;i<doc.length;i++)
{
doc(i).style.cursor = 'wait';
}

Is it possible to make a cursor into an hourglass over a drop down?
Click to expand...

If by 'drop down' you mean an HTML select element, yes. You can use a
'wait' cursor over all select elements using CSS:

<style type="text/css">
select {cursor: wait;}
</style>

You can use selectors to change the cursor based on the element's id or
class attributes. You can also use in-line styles:

<select style="cursor: wait;" ... >


Do you still want to use script?
 
J

Jim Ley

If by 'drop down' you mean an HTML select element, yes. You can use a
'wait' cursor over all select elements using CSS:

<style type="text/css">
select {cursor: wait;}
</style>

You can use selectors to change the cursor based on the element's id or
class attributes. You can also use in-line styles:

<select style="cursor: wait;" ... >


Do you still want to use script?
Click to expand...

The script above is equivalent to using the above.

OP - the better approach to this is not to change every cursor -
that's really, really slow - just add a mousemove handler to the page
and change the cursor of the element under the cursor, much more
efficient.

Jim.
 
R

RobG

Jim said:
(e-mail address removed) wrote: [...]
Is it possible to make a cursor into an hourglass over a drop down?
Click to expand...
If by 'drop down' you mean an HTML select element, yes. You can use a
'wait' cursor over all select elements using CSS:

<style type="text/css">
select {cursor: wait;}
</style>

You can use selectors to change the cursor based on the element's id or
class attributes. You can also use in-line styles:

<select style="cursor: wait;" ... >
Click to expand...
[...]

The script above is equivalent to using the above.

OP - the better approach to this is not to change every cursor -
that's really, really slow - just add a mousemove handler to the page
and change the cursor of the element under the cursor, much more
efficient.
Click to expand...

Do you mean something like:

<script type="text/javascript">

function doWait(e){
var tgt = e.target || e.srcElement;
if (tgt && tgt.tagName && tgt.style){
if ('select' == tgt.tagName.toLowerCase()){
tgt.style.cursor = 'wait';
} else {
tgt.style.cursor = 'normal';
}
}
}

</script>

<body onmouseover="doWait(event);"> ... </body>


I think CSS provides a much more elegant solution.
 
G

Giggle Girl

RobG said:
Jim said:
(e-mail address removed) wrote: [...]
Is it possible to make a cursor into an hourglass over a drop down?
If by 'drop down' you mean an HTML select element, yes. You can use a
'wait' cursor over all select elements using CSS:

<style type="text/css">
select {cursor: wait;}
</style>

You can use selectors to change the cursor based on the element's id or
class attributes. You can also use in-line styles:

<select style="cursor: wait;" ... >
Click to expand...
[...]

The script above is equivalent to using the above.

OP - the better approach to this is not to change every cursor -
that's really, really slow - just add a mousemove handler to the page
and change the cursor of the element under the cursor, much more
efficient.
Click to expand...

Do you mean something like:

<script type="text/javascript">

function doWait(e){
var tgt = e.target || e.srcElement;
if (tgt && tgt.tagName && tgt.style){
if ('select' == tgt.tagName.toLowerCase()){
tgt.style.cursor = 'wait';
} else {
tgt.style.cursor = 'normal';
}
}
}

</script>

<body onmouseover="doWait(event);"> ... </body>


I think CSS provides a much more elegant solution.
Click to expand...

I found this script which uses the BODY method:

<html>
<head>
<script type="text/javascript">

function Change_Cursor(Param1)
{
document.body.style.cursor = Param1
}

</script>

<body>

<a href="#" onclick="Change_Cursor('wait')">Change Cursor to
Wait</a><br>
<a href="#" onclick="Change_Cursor('pointer')">Change Cursor to
Pointer</a><br>
<a href="#" onclick="Change_Cursor('default')">Change Cursor to
Default</a><br>

<form>
<select>
<option>ABCDFEGHIJKLMNO</opion>
<option>PQRSTUVWXYZ1234</opion>
<option>567890ABCDFEGHI</opion>
</select>
</form>

</body>

</html>

Problem is, when you moueover elements like the LINKS or the SELECT
box, it reverts to the default behavior for those items.

Maybe you should step through every node stemming from the BODY and
change it over? And then to reset re-step and change settings back to
default?

Someone must have code this already, right?

Giggle Girl
 
N

news

I know this works on all objects except drop down boxes.

doc = document.all
for (i=0;i<doc.length;i++)
{
doc(i).style.cursor = 'wait';
}

Is it possible to make a cursor into an hourglass over a drop down?
Click to expand...

I assume what you want to do is turn the hourglass on and off when
something is happening.

One solution would be to size a floating DIV to cover the whole page
with a z-index high enough to ensure it is in front of all other
elements and set the cursor just for that DIV.

You can then just show/hide the DIV as you see fit. This has the
side-effect of disabling all the elements on the page which may or may
not be what you want.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

1st Drop-down selection determins selected value in all drop-downs In ASP.Net Wizard 0
Drop Downs tool tip doesn't work 1
Cascading drop-down restructuring 12
How to Make "Mouse-Over" Drop-Down Menus 7
4 dynamic drop downs, any tutorial or link? 3
Looking to change programming direction 1
problems with multiple (many) chained drop-downs 0
ON MOUSE OVER - POPUP 5

Members online

No members online now.
Total: 28 (members: 0, guests: 28)
Robots: 182

Forum statistics

Threads
473,774
Messages
2,569,596
Members
45,139
Latest member
JamaalCald

Latest Threads

Top