Get a free trial // Grow your CSS skills // Land your dream job

[How]When hovering on a child div the main div changes color.

  • # March 24, 2013 at 8:20 pm

    So i want to make when you hover over the #prvi div the #main changes it’s background color.

    I tried something like this:

    #prvi:hover #main{

    But that doesn’t work. Here is the[ codepen]( “codepen”).

    # March 24, 2013 at 8:31 pm

    What you need is a parent selector, which doesn’t exist yet. You can do it with jQuery though.

    # March 24, 2013 at 8:42 pm

    So it was done in jQuery [here]( “here”) ? (the Paths sections)

    Since I’m no good in jQuery i might as well give up on this ..

    # March 25, 2013 at 3:30 am

    Ugly way to do it, with Javascript. I’m sure there are more elegant solutions.

    []( “”)

    # March 25, 2013 at 6:19 am

    Yes, on that site they use JS (didn’t check if it is jQuery, but probably it is) to add classes like `path-ruby` to the container.

    Here is how it can be done using jQuery:

    @Krish1980, you’re removing all other classes from the parent div like `.parent`. That’s why I like jQuery so much, functions like `addClass` and `removeClass` automatically keep the other classes :)

    # March 25, 2013 at 11:09 am

    Wow cool stuff guys.

    @CrocoDillon nice fade in and out I was wondering where could i learn to do something like this, looks simple.

    # March 25, 2013 at 4:48 pm

    Anyone ? Any link to point me how to do this kind of stuff, nothing complicated ?

    # March 25, 2013 at 5:16 pm

    Start by learning [JavaScript](, then move on to (or skip to if you don’t feel like reading all that) [jQuery]( I haven’t really tried the last link yet but it seems rather easy with videos and exercises.

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed