tags:

views:

157

answers:

2

I am working on a very simple layout here: http://www.flanels.com/ - If you click work it draws down, I am using this jQuery:

 $('#left ul li.item').hover(function() {
   $(this).addClass('over');
 }, function() {
   $(this).removeClass('over');
 });

And this is the class:

#left ul li.over{
    background-color:#4CC7DC;    
}

If you go over the link text you see that it changes to the a:hover, I am trying to make it for when you are over the li.item the a:hover link changes as well, how can I do that?

Thanks,

Ryan

A: 

Use hover() on the li.item element, then instead of accessing $(this).add/removeClass() instead access $('#left ul li.item').add/removeClass().

That is, you can set classes on any element, not just $(this), so just name the element you want to change.

Jason Cohen
+4  A: 

Is this what you're looking for?

#left ul li.over, #left ul li.over a {
    background-color:#4CC7DC;    
}
Chris Doggett
This is the best solution I can think of as well.
Stuart Branham
Hey Chris, that worked great thank you. I see what you did with the selector, its perfect.Ryan
Coughlin
Glad I refreshed before second-guessing and trying something with jQuery.
Chris Doggett