title: Jquery mouseleave event on two elements
body: <p>I want to trigger an event when the mouse leaves two elements. I found the following jsfiddle which is exactly what I'm looking for: </p>
  
  <p><a href="http://jsfiddle.net/pFTfm/54/" rel="nofollow">http://jsfiddle.net/pFTfm/54/</a></p>
  
  <p>It uses this code: </p>
  
  <pre><code>var count = 0;
  $('#d1, #d2').mouseenter(function(){
      count++;
      $('#d3').show();
  }).mouseleave(function(){
      count--;
      if (count == 0) { 
          $('#d3').hide();
          $('#d3').css('background-color', 'orange');
      }
  });
  ​
  </code></pre>
  
  <p>However, the event still gets triggered, as you can see by the div changing its background color.</p>
  
  <p>I want the event only to be triggered when the mouse really leaves both elements.</p>