Style question - keep parent style when selecting child item

2 posts, 0 answers
  1. Joel Register
    Joel Register avatar
    2 posts
    Member since:
    Jun 2003

    Posted 23 Dec 2013 Link to this post

    I have a demo my problem online -- as you can see, I have a problem when selecting a child under Secondary Reviews or Primary Reviews. 

    I want the child items to remain as they are when you mouse over them or to just set text-decoration to underline. When you click on a child item, the parent should remain unchanged and the text of the child item should turn blue. 

    All styles are inline in the index.html page. 

    I know I'm missing something obvious here but just can't figure out how to change that child style without that change affecting the parent tem's style.

    Thanks for any help! 


  2. Kiril Nikolov
    Kiril Nikolov avatar
    2596 posts

    Posted 24 Dec 2013 Link to this post

    Hello Joel,

    You can use the classes that are applied to the child elements when they are hovered or clicked - k-state-hover and k-state-selected to apply the CSS rules that you need. You can check this in the following demo:

    As for retaining the selected state of the parent element you will need to implement some custom JavaScript code to run on the select event of the panelbar and apply the k-state-selected class on the parent element. You can check a simple example here:

    Kiril Nikolov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top