Question

Suppose we have HTML:

<div id="wrapper">

     I want this to change color when button hovered

     <div class="button">Close</div>

</div> 

We can change the element’s style when the wrapper is hovered:

#wrapper:hover .button{
 color:red
}

Now want the opposite thing:

button:hover #wrapper{
 background:yellow
}

Answer 1

@dan; you can do this with css also like this:

#wrapper{position:relative;}
#wrapper:hover .button{
 color:red;
}
.button:hover:after{
    content:"";
    background:yellow;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    z-index:-1
}

check this example http://jsfiddle.net/sandeep/b6apC/ .It’s a fake but can achieve that effect with css.