title: jQuery: Floating info pop-up in the most elegant and efficient way
body: <p>I want to implement a floating information pop-up (or how to call it), that appears when the cursor is over an element and stays within a fixed distance to the cursor. For instance something more less like here:</p>
  
  <p><a href="http://www.nytimes.com/interactive/2008/09/15/business/20080916-treemap-graphic.html" rel="nofollow">http://www.nytimes.com/interactive/2008/09/15/business/20080916-treemap-graphic.html</a></p>
  
  <p>Say, I have 100 divs for which I want the pop-up to appear. I thought about doing it in two ways:</p>
  
  <ol>
  <li><p>For each div, in HTML code I have a hidden pop-up div, on <code>mousemove</code> I show it, move to the cursor's position and on <code>mouseleave</code> I hide it. Each div has its <code>mousemove</code> (x100) and <code>mouseenter</code> event bound (x100).</p></li>
  <li><p>I have a single <code>mousemove</code> for the main area of the page,for each div on <code>mouseenter</code> and <code>mouseleave</code> I show / hide a pop-up. There is a single <code>mousemove</code> (x1) and <code>mouseenter</code> + <code>mouseleave</code> for each div (x100).</p></li>
  </ol>
  
  <p>My questions are:</p>
  
  <ol>
  <li><p>Is This The Way? Or there is some better jQuery mechanism to use?</p></li>
  <li><p>Is there any difference in performance when I have a single <code>mousemove</code> and 100 <code>mousemove</code> callbacks?</p></li>
  </ol>