Menu visibility

[LesleyGill]

I am making a menu visible when the user hovers over a button with JavaScript "applyProperty("mnuRepriceOptions", "visibility", "visible"); " on the onmouseover event . The menu displays directly over the button. When I move the mouse from the first menu option to any other menu option or off the menu, the menu becomes no longer visible. Is there a way to apply a property to the menu that would keep the menu widget visible until the user’s mouse move out of the menu?

[Antonio]

Hello Lesley,

I have sent a reply out to your email; I am copying that reply here as well.

After testing this out for a bit, it seems the problem lies with how each browser handles the onmouseout event for the menuobject. Theres not an easy way to get the menu working the way you want it to using the onmouseout event; however, you could figure out a different event to apply the visibility assignments to and perhaps getting working similarly as intended. I have attached the file with one example change (this file is in the email I have sent); in this case the menu pops up when you click the button and disappears if you select an option from the menu or if you click the button again.

Let me know if you have any more questions.

Thanks!

[DaveLClarkI]

I work with Leslie and I thought I would pass on to you that we resolved the issue by applying the following JavaScript in the menu's onmouseout event:

Code: Select all

if (window.myTimer) // if timer is active
{
  window.clearInterval(window.myTimer); // reset it
}
window.myTimer = window.setInterval(function() // start timer
{
  applyProperty("mnuRepriceOptions", "visibility", "hidden"); // to hide menu
}, 500);

and by applying the following JavaScript is the menu's onmouseover event:

Code: Select all

if (window.myTimer) // if timer is active
{
  window.clearInterval(window.myTimer); // reset it
}

That takes care of both mousing from one menu selection to another as well as mousing out of the menu altogether without clicking on any of the selections. We employed the following in the menu's onoptionclick event:

Code: Select all

if (window.myTimer)
{
  window.clearInterval(window.myTimer);
}
applyProperty("mnuRepriceOptions", "visibility", "hidden");

Lastly, note that the menu is initially displayed by mousing over a separate object which is then covered up when the menu is displayed. The following JavaScript is in that object's onmouseover event:

Code: Select all

applyProperty("mnuRepriceOptions", "visibility", "visible");