title: hover: how to trigger UI effect once?
body: <p>How to trigger jQuery-UI effect only once on mouseenter?</p>
  
  <p><a href="http://jsfiddle.net/MG4JZ/" rel="nofollow">http://jsfiddle.net/MG4JZ/</a></p>
  
  <pre><code>$('#menu a').hover(
    function() {
      $(this).css({
          'background-color': 'white',
          'color': 'black',
      }).effect('slide'); // EFFECT
    }, function() {
      $(this).css({
          'background': 'none',
          'color': 'white',
      });
  });
  </code></pre>
  
  <p>It keeps running forever while mouse is over.</p>