Can't get mouseleave() or mouseout() to work in jQuery
<p>I am working on this page: <a href="http://www.problemio.com/index_new.php" rel="nofollow">http://www.problemio.com/index_new.php</a></p>

<p>When you mouse over the "health" link, I got the popup to pop-up, but have a hard time getting it to close.</p>

<p>Here is what I did to make the popup show up:</p>

<pre><code>$("&lt;div id='pop'&gt;" + div_contents + "&lt;/div&gt;").dialog( { title: 'Secondary Categories'} );               
</code></pre>

<p>and here is how I am trying to make it close:</p>

<pre><code>$('#hea_link').mouseout(function() 
{       
    $("#pop").dialog( 'close' );                
});

$('#hea_link').mouseleave(function() 
{       
    $("#pop").dialog( 'close' );                
});
</code></pre>

<p>Neither of the ways I am trying to get the popup to close works. Also, I have no idea why clicking the x on top-right of the popup doesn't close it.</p>

<p>Any idea what I am doing wrong here?</p>
