This is a migrated thread and some comments may be shown as answers.

Remove hover style on menu

5 Answers 283 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Patrick
Top achievements
Rank 1
Patrick asked on 28 Jul 2015, 05:41 PM

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?

5 Answers, 1 is accepted

Sort by
0
Patrick
Top achievements
Rank 1
answered on 28 Jul 2015, 07:18 PM

Found it

 

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

0
Eyup
Telerik team
answered on 30 Jul 2015, 11:33 AM
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
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Yngve
Top achievements
Rank 1
answered on 05 May 2017, 01:48 PM
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.  
0
Eyup
Telerik team
answered on 08 May 2017, 12:42 PM
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
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Yngve
Top achievements
Rank 1
answered on 09 May 2017, 06:40 AM
Thank you!
Tags
Menu
Asked by
Patrick
Top achievements
Rank 1
Answers by
Patrick
Top achievements
Rank 1
Eyup
Telerik team
Yngve
Top achievements
Rank 1
Share this question
or