DOM cursor issues

[piccolo]

This is the first time I've posted a 'help' request, so please be patient.

I've created a DOM web page where with the usage of usemap images on the page change upon rollover using JavaScript. Other than href, is there a way to make the cursor change upon rollover?

Only when a particular area has been clicked on do I wish for others to react to a rollover. This is all done in JS within the same page, and it works - except for the mouse change.

I've tried the following script (embedded within a JS function called upon by a mouseover):

firstCssFile=do cument.styleShe ets[0];
myCssRule=first CssFile.cssRule s? firstCssFile.cs sRules:firstCss File.rules;

myCssRule[0].style.cursor=" pointer";
myCssRule[0].style.cursor=" hand";

In the attached CSS file the first rule (line) is: body {cursor: default;}

Scripted for both platforms, the above function should cause the cursor to change upon mouseover. It works great with IE, but, ironically, not with Safari or FireFox.

However, if I get rid of the usemap in the <img> tag and attach this script directly to a mouseover within the image tag then all works fine. But that defeats the purpose of using imagemaps.

And, oh, when it works from within the <img> tag, FireFox's JS console tells me there's a parsing error with the first rule of the attached CSS file (i.e. the cursor statement.)

Can anyone help me? Does anyone know the solution? I'd be appreciated :)

[Banfa]

I think I would create a javascript function like this

function ChangeRollover( id )
{
  var element = document.getElementById( id );
  if ( element )
  {
    element.style.cursor = "pointer";
    element.style.cursor = "hand";
  }
}
 

The difference between my code and your code is that your code trys to directly alter the load CSS file where as mine alters the inline style tags. Because of the way CSS cascades altering the style tags take precedence over what is in the CSS file so this works as a way of changing styles on a given element.

Additionally it is supported cross browser without modification (in theory) because it is part of the HTML DOM.

Call my function with the id of the tag you want to change the cursor for (set using the id attribute).