Using JavaScript to Customize Mouse Pointer Graphic??

[Prisoner at War]

I know about the * * style="cursor: pointer; cursor: hand;" * *
attribute of the <img> tag, but is there a way JavaScript can "load
in" one's own graphic for such events??

How?


TIA!

 

[Martin Honnen]

I know about the * * style="cursor: pointer; cursor: hand;" * *
attribute of the <img> tag, but is there a way JavaScript can "load
in" one's own graphic for such events??

CSS allows
cursor: url(some-cursor.file);
I think but I don't know about supported file formats and browser
support for that feature: http://www.w3.org/TR/CSS21/ui.html#cursor-props

 

[Prisoner at War]

CSS allows
cursor: url(some-cursor.file);
I think but I don't know about supported file formats and browser
support for that feature:http://www.w3.org/TR/CSS21/ui.html#cursor-props

Hmm, I'm using

style="cursor: url(db2.gif);"

within an <img> tag and it's not working...any idea what I've left
out??

Thanks for the w3.org link -- but I don't have the technical
background yet to really make sense of the reference entry there! =(

 

[Martin Honnen]

Hmm, I'm using

style="cursor: url(db2.gif);"

within an <img> tag and it's not working...any idea what I've left
out??

As I said, I don't know of browser support for that feature, the IE
documentation suggests that IE 6 and later support the url feature for
..cur and .ani cursor files:
<http://msdn2.microsoft.com/en-us/library/aa358795(VS.85).aspx>

And I think the W3C wants you to specify a list of at least one URL plus
a backup e.g.
cursor: url(cursor1.cur), auto;
so that the cursor is defined even if url is not supported.

Here is an example that works with IE 6:
http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/cursor_c.htm

 

[Prisoner at War]

As I said, I don't know of browser support for that feature, the IE
documentation suggests that IE 6 and later support the url feature for
.cur and .ani cursor files:
<http://msdn2.microsoft.com/en-us/library/aa358795(VS.85).aspx>

I think it must be something I'm not doing...doesn't work in MSIE 7,
neither...what am I missing? Let's see...

style="cursor: url(db2.gif);"


For "url" am I supposed to put a pathname? Everything is offline
right now...

style="cursor:../images(db2.gif);"


No matter if I use absolute or relative paths, that doesn't work in
any browser. I think I'm not using the format correctly, but I don't
know where I'm doing something wrong.

And I think the W3C wants you to specify a list of at least one URL plus
a backup e.g.
cursor: url(cursor1.cur), auto;
so that the cursor is defined even if url is not supported.

Here is an example that works with IE 6:http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/...

FANTASTIC!!

Strange thing, though...using IE 7 (does *not* work in FF or Opera),
only Cursor #1 works; Cursor #2 is like a dead link or something;
nothing happens, no change in mouse pointer graphic...guess they
forgot to load up an image file or something!

OMG, I can't believe MSIE is more W3C-compliant than FF and Opera!!
LOL!!

Oddly enough, I can't apply my own graphic for some reason...are the
files supposed to end in ".cur" for some reason?? I must be doing
something wrong in how I'm telling the browser to "use *this*
file"....

 

[Prisoner at War]

Strange news!!

First of all, I was indeed incorrect in my usage. For the record,
proper usage is

style="cursor: url(relative/path/file.ani);"


The relative path goes in the parentheses, and it *must* point to
a .ani or .cur file. I was using a .gif as a test file originally,
but that simply *cannot* work, ever.

However, the really odd thing is that you cannot use a "fall-back"
like

style="cursor: url(relative/path/file.ani); cursorointer;"


as is recommended, in case the browser didn't understand...well,
nothing worked in MSIE 7 until I had *removed* that "fall-back,"
"cursorointer"!

So

style="cursor: url(relative/path/file.ani); cursorointer;"


doesn't work, even in MSIE 7, but

style="cursor: url(relative/path/file.ani);"


does!

So, the custom pointer can only show up in MSIE 7, but only if the
"fall-back" hand pointer used by Opera and Firefox isn't present --
else MSIE 7 "prefers" it and uses it, instead of the custom pointer!!

?!?!?!