得到鼠標的位置相對於父元素

這是我的設置得到鼠標的位置相對於父元素

<div id="uxcParent"> 
<div id="uxcClickable"></div> 
</div>

現在，當在內部元件用戶點擊我想相對於父DIV，而不是網頁的鼠標位置。

這是我試過的。

var x= e.pageX- obj.offsetLeft; 
var y= e.pageY- obj.offsetTop;

這工作正常，只有當我不滾動頁面。我希望函數能夠返回相同的值，而不管我的元素在同一頁面上。

更新：

我認爲這是不夠清晰。我現在詳述更多..

認爲這些元素是相對於文檔在x位置的文檔。該頁面有一個滾動條。現在我可以滾動到頁面的任何部分，位置仍然是x。但相對於觀察口的位置會發生變化。所以pageX和pageY會給出不同的值。這是我的追趕。

我的元素可以隨時隨地在視口中，當我走在內部元件我應該得到座標相對於只母

希望我（不應該由當父所影響）現在很清楚。

來源

2010-03-25 ZX12R

這是一個錯字或實際上在你的代碼中，你正在引用Y座標到x變量？ – markcial 2010-03-25 12:42:57

這是一個錯字..已經改變.. – ZX12R 2010-03-25 12:49:47

如果滾動是唯一讓你煩惱的事情，那麼我會認爲在scrollLeft和scrollTop中添加可以解決這個問題。

來源

2010-03-25 14:12:23 Shaunwithanau

這很有趣，我認爲this document可以幫助你很多。

來源

2010-03-25 12:30:04

爲此，您可以使用jQuery這樣的：

<html> 
<head> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
    $("#special").click(function(e){ 
     $('#status2').html(e.pageX +', '+ e.pageY); 
    }); 
}) 
</script> 
<body> 

<h2 id="status2"> 
0, 0 
</h2> 
<div style="width: 100px; height: 100px; background:#ccc;" id="special"> 
Click me anywhere! 
</div> 
</body> 
</html>

注意，像素值給出相對於整個文檔。如果要計算特定元素內或視口內的位置，可以查看offsetY和offsetX，並執行一些算術運算以找到相對值。

這裏是找到特定元件內的位置，而不是頁的一個示例：

$("#special").click(function(e){ 

    var x = e.pageX - this.offsetLeft; 
    var y = e.pageY - this.offsetTop; 

     alert(x +', '+ y); 
    });

在哪裏「特殊」是內元件的ID。

來源

2010-03-25 12:41:16 o15a3d4l11s2

我在jquery文檔中看到了這個。這不是我的問題..我會更新我的問題，並使其更清楚.. – ZX12R 2010-03-25 12:51:14

得到鼠標的位置相對於父元素

回答

相關問題