html - Keep div:hover open when changing nested select box

Question

This is an IE-only problem. You can see the problem here(dead link) with IE (wait for the page to load, and hover the NY Times icon in the bottom left toolbar. Then try to select a new option). The Layout: .toolTip becomes visible when it's parent div is hovered over. Inside of .toolTip is a select box. When the user opens the select box to make a selection, the parent element gets hidden.

Why is IE thinking that when I hover over the Select box, I am not over the parent div anymore?

Here is some relevant code (pared down for clarity):

#toolBar .toolTip {
    position: absolute;
    display:none;
    background: #fff;
    min-width: 300px;
    }   

#toolBar .socialIcon:hover .toolTip {
    display:block;
    }

and

<div id="toolBar">
<div class="socialIcon">
     <span class="toolTip">
         <h1>NY Times Bestsellers Lists</h1>
           <div id="nyTimesBestsellers">
             <?php include('/ny-times-bestseller-feed.php') ?>
           </div>

       <p>
          <select id="nyTimesChangeCurrentList" name="nyTimesChangeCurrentList"> 
            <option value="hardcover-fiction">Hardcover Fiction</option> 
            <option value="hardcover-nonfiction">Hardcover Nonfiction</option> 
            <option value="hardcover-advice">Hardcover Advice</option> 
          </select>
       </p>
     </span>
</div>
</div>

What I've Tried

Moving the select element in and out of other elements. Changing the position and display properties on the select, option, p, span, div, that are involved here.

Answer 1

Solved this by adding a <a href="#" class="closeParentBox">close</a> to the .toolTip div and with

<!--[if IE]>
<script type="text/javascript">
  jQuery(function($){
    $('.toolTip select').focus(function(){
        $(this).parents('.toolTip').addClass('keepOpen');
    });
    $('.toolTip select').blur(function(){
        $(this).parents('.toolTip').removeClass('keepOpen');
    });

    $("a.closeParentBox").click(function(){
        $(this).parents('.toolTip').fadeOut();
        return false;
    });
  });
</script> 
<![endif]-->

Not pretty ... I'd love to hear better answers, though.