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! 

    Joel


  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 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:

    http://jsbin.com/EBujumi/1/edit

    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:

    http://jsbin.com/otomUrU/1/edit

    Regards,
    Kiril Nikolov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
Back to Top