Preventing jQuery function to repeat effect twice?
<p>i am making a something like this :
When a user <strong>mouseenter</strong> DIV1 , the DIV2 will <strong>fadeIn</strong> and when the user <strong>mouseout</strong> DIV1 , DIV2 will <strong>fadeOut</strong></p>

<p>But something weird is happening , when you hover in and out DIV1 quickly , the FADEIN and OUT effect of DIV2 will repeat the total number of your hovers in.</p>

<p>For example:
i quickly hovers in and out for 10 times @ DIV1 , DIV2 will continue to FADE IN and OUT for 10 times although my mouse is not hovering it.</p>

<p>I hope people understand what i'm saying.</p>

<p>CODE:</p>

<pre><code>$('div1').bind('mouseenter', function() {
   $('div2').fadeIn(600);
});
$('div1').bind('mouseout', function() {
   $('div2').fadeOut(600);
});
</code></pre>

<p>Thanks and have a nice day .</p>
