Menu item remains in hover state when cursor leaves browser

[Phill Hodgkinson]

Hi there,
I have a menu with large tall buttons that are right at the top edge of the browser window. When you mouse over the HoverImageUrl gets set and when you mouse out and on to the next menu item or to the page below the menu item image is reset to the default ImageUrl. However if you move the mouse up, out of the browser window, the menu item remains in it's hover state, worse is that if you then come back into the browser window on a different menu item you end up having two menu items in hover/selected state.

Is this a known issue? Is there an easy work around? Any tips would be appreciated.

Regards,
Phill

[Kamen Bundev]

Hi Phill,

Unfortunately leaving the browser window doesn't fire a mouseout for the elements in it, only for the document. An easy workaround would be to add a document event that would close the menu (I'm using the mouseleave event so that it is only fired when the cursor actually leaves the document and not entering in any elements in it:
$telerik.$(document).mouseleave( function () {
      $find('<%= RadMenu1.ClientID %>').close();
});

Replace RadMenu1 with the ID of your control. Let me know if this helps.

Regards,
Kamen Bundev
the Telerik team

[Phill Hodgkinson]

Hi Kamen,

I'd seen a similar recommendation in another post but this doesn't solve the issue. If you go to your menu demo that uses All Images and then scroll the browser window so the top of the menu is at the top edge of the browser window you'll see the issue I'm referring to (screen shot attached). The menu.close() call on mouseleave makes sure any expanded menus are closed but it doesn't change the image url back to the default, it remains as the hoverimageurl.

Maybe this is a bug? Maybe the .close() call should not only close expanded sub menus but also should reset imageurls.

Cheers,
Phill

[Kamen Bundev]

Hi Phill,

You're right, the focus returns after leaving the window, though this wasn't a bug but rather intended behavior to ease the keyboard navigation in RadMenu - to move the item focus to the parent item when the child submenu is closed on mouseout. However since applying this by default changes slightly the behavior of RadMenu and mixed usage of mouse and keyboard navigation is seldom used, I've partially reverted the change and modified the way the subitem focus is removed. The fix will be available with the next internal build and the next service pack.

Let me know if the change helps (along with the previous handler).

Kind regards,
Kamen Bundev
the Telerik team

[Dobre]

Nice workaround :) 10x!