Is there an easy wasy to set the cursor position when a page loads?

I doubt if there is an 'easy' way. It would certainly be a bit of a security issue if you could do that sort of thing with JS - something best left upto the OS, not the browser.

An idea...

What about only activating your rollover links after the onmouseout event of your large rollover image has been triggered? And/Or... activate your rollover links in the onmouseover event of the rest of your page?

Thanks for the ideas, but if I understand you correctly, nothing happens when rolling over the image, only when they roll off -- that gives the impression that the roll-over isn't working when they move the cursor to some region of it.

If I missed your point, please explain a little clearer.

Is there a way to create a focus point off the image, like when the cursor is auto-placed in the first text box of a page?

Update: your OnMouseOut idea got me thinking to try other alternatives to OnMouseOver, so I visited Microsoft's Event Handler page:

[msdn.microsoft.com...]

There are some pretty useful tools there and I found 2 that I thought were perfect, but in typical Microsoft fashion, they don't seem to work as described:

OnMouseEnter is supposed to trigger only when the cursor moves onto the object from outside, but for me it doesn't trigger at all (maybe it doesn't work on rollover <area shape> tags).

OnMouseMove is supposed to trigger when the mouse MOVES on an object, but for me it still triggered when the stationary cursor was positioned over the newly loaded image. Can't tell if it's just so sensitive that it triggers on unintentional micro-movements, or it plain doesn't work.

I'll keep playing around with those two and others.

...nothing happens when rolling over the image, only when they roll off -- that gives the impression that the roll-over isn't working when they move the cursor to some region of it.

Well, nothing happens until they move off the image initially and then move back over it (since by then you have assigned the onmouseover events in code) - but yes, not that good, as it does give the impression that it's just not working.

Is there a way to create a focus point off the image, like when the cursor is auto-placed in the first text box of a page?

You could set .focus() to another element, but it won't move the mouse or effect the onmouseover events.

OnMouseEnter...

It's not part of the standards, it could be IE only? Can't say for sure as I've not used it.

OnMouseMove is supposed to trigger when the mouse MOVES on an object, but for me it still triggered when the stationary cursor was positioned over the newly loaded image. Can't tell if it's just so sensitive that it triggers on unintentional micro-movements, or it plain doesn't work.

It sounds like the onmousemove event is be being triggered the first time the cursor appears over the element - which could be said to be appropriate behaviour...?

Maybe you could wait a few seconds after the page has loaded before you action your onmouseover/onmousemove events? You could use the setTimeout() function in the onload event to set a variable after a few seconds and check for this in your events... or just assign the events using setTimeout()? As the page loads you could display something over the top of your roll-over image (a brief message perhaps?) and remove that after a few seconds?

The timeout idea might work -- I'll give that a try.

Re OnMouseEnter, well, I tested it in IE, so go figure. According to the specs, it should do exactly what I want. Microsoft says:

The event fires only if the mouse pointer is outside the boundaries of the object and the user moves the mouse pointer inside the boundaries of the object. If the mouse pointer is currently inside the boundaries of the object, for the event to fire, the user must move the mouse pointer outside the boundaries of the object and then back inside the boundaries of the object.

The glitch may be here:

Unlike the onmouseover event, the onmouseenter event does not bubble. In other words, the onmouseenter event does not fire when the user moves the mouse pointer over elements contained by the object, whereas onmouseover does fire.

Does that mean it won't work on regions of a rollover image? The site says the event applies to the <area> tag, so it's not clear.

Unfortunately, it's the only event for which they don't have an example and demo, so I can't see exactly how they use it and how it works. Here's the page:

[msdn.microsoft.com...]

Getting back to your original idea about activating the rollover links after onmouseout of the main image, you said:

nothing happens until they move off the image initially and then move back over it

That IS what I want; how do I trigger OnMouseOver only after OnMouseOut? I didn't know you can nest commands like that. Can you give me some simple code?

"Unlike the onmouseover event, the onmouseenter event does not bubble. In other words, the onmouseenter event does not fire when the user moves the mouse pointer over elements contained by the object, whereas onmouseover does fire."

Does that mean it won't work on regions of a rollover image? The site says the event applies to the <area> tag, so it's not clear.

I can only get the onmouseenter to work in IE6, and then only on the IMG tag, not the AREA tag directly. (?)

"nothing happens until they move off the image initially and then move back over it"

That IS what I want; how do I trigger OnMouseOver only after OnMouseOut? I didn't know you can nest commands like that. Can you give me some simple code?

Well, it's not really nesting commands... it is simply assigning the OnMouseOver event from within the OnMouseOut event... like so...
(Removed the error checking for clarity.)

HTML:

<img id="myRolloverImg" ....

JavaScript:

window.onload = assignOnMouseOut; 
// Assigned initially, when page loads 
function assignOnMouseOut() { 
 var el = document.getElementById('myRolloverImg'); 
 el.onmouseout = function() {assignOnMouseOver();} 
} 
// Called from onmouseout event 
function assignOnMouseOver() { 
 var el = document.getElementById('myRolloverImg'); 
 el.onmouseout = null;// No need to trigger again 
 el.onmouseover = function() {...ACTION TO PERFORM...} 
}

This is applying both mouse events directly to the IMG tag. I guess if you are using a client-side image map, you could assign the onmouseover events directly to the AREA tags instead.

I think I follow your idea, but I can't get it to work.

My rollover is set up like this:

<head>
<script language="JavaScript" type="text/javascript">
// rollover images
// 'a' vars trigger on mouseover
// 'b' vars trigger on mouseout
a11 = new Image(400,400)
a11.src = "/images/1active.gif"
b11 = new Image(400,400)
b11.src = "/images/1done.gif"

a22 = new Image(400,400)
a22.src = "/images/2active.gif"
b22 = new Image(400,400)
b22.src = "/images/2done.gif"
// etc. (8 image regions total)
</script>

<script language="JavaScript" type="text/javascript">
// functions called from <body> HTML
// 'a' functions called on mouseover
// 'b' functions called on mouseout
function a1() {document.map1.src = a11.src; return true;}
function b1() {document.map1.src = b11.src; return true;}
function a2() {document.map2.src = a22.src; return true;}
function b2() {document.map2.src = b22.src; return true;}
// etc. (8 pairs total)
</script>

</head>
<body>

<img src="/images/rollover.jpg" width="400" height="400" border="0">

<map name="Map"><area shape="..." coords="..." onMouseOver="a1()" onMouseOut="b1()"><area shape="..." coords="..." onMouseOver="a2()" onMouseOut="b2()"><!-- etc. (8 area shapes total) --></map>

I tried applying your code as follows:

After the above <head> code:

<script language="JavaScript" type="text/javascript">
function assignOnMouseOut() { 
var el = document.getElementById('myRolloverImg'); 
el.onmouseout = function() {assignOnMouseOver();} 
}

function assignOnMouseOver() { 

var el1 = document.getElementById('a1'); 
el1.onmouseover = function() {document.map1.src = a11.src; return true;} 
el1.onmouseout = function() {document.map1.src = b11.src; return true;} 

var el2 = document.getElementById('a2'); 
el2.onmouseover = function() {document.map2.src = a22.src; return true;} 
el2.onmouseout = function() {document.map2.src = b22.src; return true;} 
}
// etc. (8 var sets total)
</script>

<script language="JavaScript" type="text/javascript">
window.onload = assignOnMouseOut; 
</script>

In <body>:

<img src="/images/rollover.jpg" width="400" height="400" border="0" id="myRolloverImg">

<map name="Map"><area shape="..." coords="..." id="a1"><area shape="..." coords="..." id="a2"><!-- etc. (8 total) --></map>

I didn't get any result on the rollovers using the above code.