Stopping a function?

[Brent]

I wrote a "show div"* function that fires (and sets a DIV's "display"
style to '') when the user mouses over a certain area on the screen. I
also have a "fade div"** function that fires when the user moves the
mouse away from that area. This all works quite nicely.

But I'd like to add one more behavior...I'd like the div fade to stop if
the user happens to mouse over the popup div, and stay stopped so long
as the user remains within the boundaries of the div. If the user
leaves, then the fading would begin anew.

I tried adding the Show() function to the onmouseover event of the div,
but it continues fading even when I pass the mouse over it. Somehow I
need to stop the fading (fired by the onmouseout) and start the showing
fired by the onmouseover of the div.

I'd sure appreciate any help in solving this problem.

Thanks!

--Brent
*Show div
======================
var currentlyVisiblePopup;
function Show(e,divId,offsetX,offsetY,windowOrMouse)
{
if(windowOrMouse == "m")
{
offsetX = e.clientX + offsetX;
offsetY = e.clientY + offsetY;
}
if(currentlyVisiblePopup != divId)
{
if(currentlyVisiblePopup != null){Hide(currentlyVisiblePopup,0);}
var id = document.getElementById(divId);
id.style.display = '';
document.getElementById(divId).style.left = offsetX;
document.getElementById(divId).style.top = offsetY;
window.currentlyVisiblePopup = divId;
}
}
**Fade div
=====================
function fade(divId,opacity) {

if (document.getElementById) {
id = document.getElementById(divId);
if (opacity >= -10) {
setOpacity(id, opacity);
opacity = opacity - 10;
window.setTimeout("fade('"+divId+"',"+opacity+")", 100);
}
}
if(opacity < -10){Hide(divId,0);}
}

[RobG]

Brent > wrote:

I wrote a "show div"* function that fires (and sets a DIV's "display"
style to '') when the user mouses over a certain area on the screen. I
also have a "fade div"** function that fires when the user moves the
mouse away from that area. This all works quite nicely.

But I'd like to add one more behavior...I'd like the div fade to stop if
the user happens to mouse over the popup div, and stay stopped so long
as the user remains within the boundaries of the div. If the user
leaves, then the fading would begin anew.

I tried adding the Show() function to the onmouseover event of the div,
but it continues fading even when I pass the mouse over it. Somehow I
need to stop the fading (fired by the onmouseout) and start the showing
fired by the onmouseover of the div.

I'd sure appreciate any help in solving this problem.

Create an object that does the fading and stores the relevant values and
references.

Give the object a start and stop method. Start and stop it as appropriate.

If you want to do multiple simultaneous fades, make a constructor that
builds a fade object for each element being faded. Start and stop them
as appropriate - you may need another object to keep references to the
fade objects you've created and to destroy them when they've finished.
[...]
--
Rob