RadMenu separator triggers OnClientMouseOut

[Marco]

Hello.

We have a Radmenu that uses a Sitemap data source, and we have the menu set up with a OnClientMouseOut function that shows a overlay to mask a section of the page. However, when the mouse goes over separators, the overlay is hidden, and then pops up again once it goes over a menu item, it's like it does not count separators as being part of the menu. Is there a way to prevent this from happening?

Thanks,

Marco

[Peter Milchev]

Hello Marco,

The default MouseOver and MouseOut events are fired only for non-separator items.

One option to fire these events on separator hover is demonstrated below:
 

<telerik:RadMenu RenderMode="Lightweight" ID="RadMenu1" runat="server" OnClientMouseOut="OnClientMouseOut"
    OnClientMouseOver="OnClientMouseOver" OnClientLoad="OnClientLoad"/>

function OnClientLoad(sender, args) {
    $telerik.$('.rmItem.rmSeparator', sender.get_element()).on({
        mouseenter: function mousein(ev) {
            console.log("separator in");
            var sender = ev.target._item._control;
            var item = ev.target._item;
            var args = new Telerik.Web.UI.RadMenuMouseOverEventArgs(item, ev);
            OnClientMouseOver(sender, args);
        },
        mouseleave: function mouseout(ev) {
            console.log("separator out");
            var sender = ev.target._item._control;
            var item = ev.target._item;
            var args = new Telerik.Web.UI.RadMenuMouseOutEventArgs(item, ev);
            OnClientMouseOut(sender, args);
        }
    });
}
function OnClientMouseOver(sender, args) {
    console.log("OnClientMouseOver");
}

function OnClientMouseOut(sender, args) {
    console.log("OnClientMouseOut");
}

Regards,
Peter Milchev
Progress Telerik