2011-06-02 142 views
3

可能重複:
Get element at specified position - JavaScript如何檢測任意鼠標位置(x,y)上的元素?

如何可以檢測在任意鼠標位置的元素(x,y)的?

我使用mouseenter/mouseleave突出顯示懸停的物品。不幸的是,當鼠標隱式移動時,這些都不會觸發,並導致錯誤的項目被突出顯示。隱式移動鼠標的例子是用箭頭鍵或軌跡板滾動頁面。

你可以看到評論這裏工作演示:http://jsfiddle.net/bkG2K/6/

我的解決方法,想法是檢查鼠標的位置,每隔一段時間,或只是滾動如果可能的話,並基於當前更新懸停狀態後鼠標座標。但我不知道如何找到給定X,Y的DOM元素。

想法?如果你有更好的解決方案解決根本問題,請隨意!

回答

0

我不知道內部實現是否有所不同,但是您試圖實現預期方法的方法是.hover(...),它會在每個狀態更改中執行兩次回調。

或者,你可以setInterval()和光標的位置模擬.mousemove()事件(雖然你應該做一個broswer檢查,只用它在有問題的瀏覽器,因爲這是怎樣的一個黑客攻擊,並儘可能少的人予以曝光)

1

您可以使用原生JavaScript elementFromPoint(x, y)方法,該方法返回視口中座標爲x,y的元素。

elementFromPoint w3c draft

而且,代碼示例:

<html> 
<head> 
<title>elementFromPoint example</title> 

<script type="text/javascript"> 

function changeColor(newColor) 
{ 
elem = document.elementFromPoint(2, 2); 
elem.style.color = newColor; 
} 
</script> 
</head> 

<body> 
<p id="para1">Some text here</p> 
<button onclick="changeColor('blue');">blue</button> 
<button onclick="changeColor('red');">red</button> 
</body> 
</html> 

您可以使用setInterval()不斷地檢查元素的懸停事件,但它不建議,儘量使用.hover(...)和CSS,而不是提升應用性能。

相關問題