在javascript中獲取相對鼠標X/Y

我在頁面上的某處有一個div。然後我得到鼠標XY：在javascript中獲取相對鼠標X/Y

 var relativeMouseX = self.gCurrentMouseX - self.gContainerLeft; 
     var relativeMouseY = self.gCurrentMouseY - self.gContainerTop;

凡通過獲得的電流mousex/Y：

// 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; 
    } 
}

此測試工作得很好，但是當DIV位於下一個頁面，它攪亂了他們的X/Y，因爲座標似乎只在視圖區而不是整個頁面。

X協作工作正常，因爲頁面橫向擴展不會比瀏覽器大，但垂直是一個問題！

任何想法如何讓鼠標X/Y相對於元素？

來源

2010-12-21 Tom Gullen

您可能只需要知道元素的位置並計算這些差異即可。 – yoda 2010-12-21 15:21:20

event.clientX+document.body.scrollLeft和event.clientX+document.body.scrollTop 或 event.pageX和event.pageY

第一種是僅僅增加當前的滾動位置的值，第二個是相對於頁面的鼠標位置，不客戶端窗口。

來源

2010-12-21 15:28:17 JCOC611

然而，這是相對於頁面而言，並非一個元素 – JCOC611 2010-12-21 15:28:54

您需要考慮父元素以在頁面上查找子元素的真實位置。見http://www.quirksmode.org/js/findpos.html

/** 
* Locate the real position of an element, 
* relative to its parent's offsets 
*/ 
function findPos (obj) { 
    var curleft = 0, 
     curtop = 0; 

    if (obj.offsetParent) { 
     do { 
      curleft += obj.offsetLeft; 
      curtop += obj.offsetTop; 
     } while (obj = obj.offsetParent); 

     return { x: curleft, y: curtop }; 
    } 
}

來源

2010-12-21 15:28:06 Kai

在javascript中獲取相對鼠標X/Y

回答

相關問題