Hover over sub item

[Jacques]

Hi there,

I am using a custom skin build with the Visual Style Builder and I am having trouble implementing the following scenario:

When I hover over a main item the color of the main item changes from Red to White, which is OK (see Main item hover.png)
When I hover over a sub item I want the color of the Main text item still be White. Now it changes back to Red (see Sub item hover.png).

Anybody any idea?Thanx!

Marcel

[Ivan Danchev]

Hi Marcel,

To achieve that you can use the OnClientMouseOver client-side event to add a class to the hovered item's parent:

<telerik:RadMenu ID="RadMenu1" runat="server" OnClientMouseOver="ChangeParentColor" >

function ChangeParentColor(menu, args) {
    $telerik.$(args.get_item().get_parent().get_element()).addClass("redColor");
}

Then you can apply the red color to the class with CSS:

.RadMenu .redColor .rmRootLink {
   color:red;
}
.RadMenu .redColor a.rmLink:hover {
    color:red;
}

Regards,
Ivan Danchev
Telerik