Get Mouse Position or Element Position
<p>I am working on a tooltip plugin with the following options:</p>

<ol>
<li><p>Mouse = True|False. Tooltip position relative to Mouse or Element;</p></li>
<li><p>Static = True|False. Follow mouse when option Mouse = true.</p></li>
</ol>

<p>I have a JSFiddle example in: <a href="http://jsfiddle.net/mdmoura/RPUX6/" rel="nofollow">http://jsfiddle.net/mdmoura/RPUX6/</a></p>

<p>THE PROBLEM:</p>

<p>When I place the mouse over the last tooltips of the list the position is wrong.</p>

<p>This happens every time I have scrolled the page ... I have no idea why.</p>

<p>The part of the code which sets the position is:</p>

<pre><code>$(this).each(function (e) {
  // SOME CODE  

  $this.mouseenter(function (e) {

    var $tooltip =
      $("&lt;div&gt;")
      .attr("class", options.class)
      .html(options.content !== '' ? (typeof options.content === 'string' ? options.content : options.content($this, $tooltip)) : tooltip.title)
      .appendTo('body');

    $this.attr('title', '');

    var position = [0, 0];

    if (options.mouse) {
      position = [e.clientX + options.offset[0], e.clientY + options.offset[1]];
    } else {
      var coordinates = $this[0].getBoundingClientRect();       
      position = [
        (function () {
          if (options.offset[0] &lt; 0)
            return coordinates.left - Math.abs(options.offset[0]) - $tooltip.outerWidth();
          else if (options.offset[0] === 0)
            return coordinates.left - (($tooltip.outerWidth() - $this.outerWidth()) / 2);
          else
            return coordinates.left + $this.outerWidth() + options.offset[0];

        })(),
        (function () {
          if (options.offset[1] &lt; 0)
            return coordinates.top - Math.abs(options.offset[1]) - $tooltip.outerHeight();
          else if (options.offset[1] === 0)
            return coordinates.top - (($tooltip.outerHeight() - $this.outerHeight()) / 2);
          else
            return coordinates.top + $this.outerHeight() + options.offset[1];

        })()
      ];
    }

    $tooltip.css({ left: position[0] + 'px', top: position[1] + 'px' });
</code></pre>

<p>You can also see the code and the demo in <a href="http://jsfiddle.net/mdmoura/RPUX6/" rel="nofollow">http://jsfiddle.net/mdmoura/RPUX6/</a>.</p>

<p>Thank You,
Miguel</p>
