Question

I have in a sidebar:

<div id="yyy"> [shortcode]</div>

It outputs a title that when hovered on drops down to show a menu.

When hovering on the title a background color shows up and disappears when the mouse moves down to the menu items.

I need for the background color to remain as long as the menu has focus, I need something like:

If div.domTip_tipBody  has focus then #yyy a.tippy_link {background:red;}

[The following I got from here][1]

I think this will give me what I am looking for but I do not know how to translate

.answerSpace to ? .normProf to ? opacProf to ?

in:

$('.answerSpace').bind('blur', function(){
$('.normProf').removeClass("normProf").addClass('opacProf'); });

$('.answerSpace').bind('focus', function(){
$('.opacProf').removeClass("opacProf").addClass('normProf'); });

Answer 1

This Worked (thanks dunc)

add_action('wp_footer','myscript_in_footer'); 
function myscript_in_footer(){ 
?> 
<script type="text/javascript"> 
 jQuery(document).ready(function(){ 
   jQuery("*").delegate("div.domTip_tipBody","mouseover",function(){ 
    jQuery("#yyy a.tippy_link").css("background-color","#392281"); 
    });  

   jQuery("*").delegate("div.domTip_tipBody","mouseout",function(){ 
    jQuery("#yyy a.tippy_link").css("background-color","transparent"); 
    });  
   }); 
</script> 
<?php 
}