Remove hover style on menu

[Patrick]

Using the MVC menu I cant get rid of the text color style on hover.  It seems something is firing on JQuery when the item is hovered.  Its appending k-state-hover, which is setting the color property somewhere in the kendo style sheets.

I've tried to get rid of if using

 

#topmenu li .k-state-hover         

{         

color: #fdfdfd;   

    }​

or

#topmenu .k-state-hover         
{         
color: #fdfdfd;   
    }​​

with no luck.  Any ideas?

[Patrick]

Found it

 

#topmenu .k-link        {        color: #fdfdfd;      }​

[Eyup]

Hello Patrick,

Thank you for sharing your specific solution with our community.
Please feel free to turn to us if new questions arise.

Regards,
Eyup
Telerik

[Yngve]

Is there a way to just get rid off all the hover styling? It's really cumbersome to go through all the hover effects that are happening and override them with my own hover effects. I've been sitting for a whole day now doing something I feel shouldn't really be neccessary.  

[Eyup]

Hello Yngve,

Although there is no dedicated property to achieve this requirement, you can use CSS:

<style>
  .k-menu .k-state-hover,
  .k-menu .k-state-border-down,
  .k-menu .k-state-hover .k-link
  {
    background-color: transparent !important;
    background-image: none !important;
    color: #515967 !important;
  }
</style>

You can also check the sample here:
http://dojo.telerik.com/uLuXu/7

You can also check these resources for general customization info:
http://docs.telerik.com/kendo-ui/styles-and-layout/appearance-styling
http://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes

I hope this will prove helpful.

Regards,
Eyup
Telerik by Progress

[Yngve]

Thank you!