title: Getting relative mouse X/Y in javascript
body: <p>I have a div somewhere on the page.  I then get the mouse XY:</p>
  
  <pre><code>        var relativeMouseX = self.gCurrentMouseX - self.gContainerLeft;
          var relativeMouseY = self.gCurrentMouseY - self.gContainerTop;
  </code></pre>
  
  <p>Where the current mousex/y are obtained via:</p>
  
  <pre><code>// Update mouse coords
  this.gUpdateMousePos = function(evt) {
      if (evt === undefined) evt = window.event;
      if (window.event) {
          this.gCurrentMouseX = event.clientX;
          this.gCurrentMouseY = event.clientY;
      }
      else {
          this.gCurrentMouseX = evt.clientX;
          this.gCurrentMouseY = evt.clientY;
      }
  }
  </code></pre>
  
  <p>This worked fine in testing, but when the div is located down a page, it messes up themouse X/Y, as the co-ordinates only seem to be in the viewinwg area and not the entire page.</p>
  
  <p>X co-ord works fine, because the pages never expand horizontally wider than the browser size, but vertical is a problem!</p>
  
  <p>Any ideas how to get mouse X/Y relative to the element?</p>