Sys.UI.DomElment.getLocation在Google Chrome瀏覽器中返回的值不同於其他瀏覽器中的

我在Chrome瀏覽器中使用我的畫布元素時遇到了一些麻煩。Sys.UI.DomElment.getLocation在Google Chrome瀏覽器中返回的值不同於其他瀏覽器中的

我有一個畫布上有多個矩形。我跟蹤名爲targets的數組中的矩形。每當鼠標移過畫布時，我都會調用懸停功能來檢查鼠標是否位於其中一個矩形的頂部。

如果它位於矩形的頂部，矩形應填充純色。

看看這個JavaScript行：

function hover() { 
    var location = Sys.UI.DomElement.getLocation(canvasElement); 

    // loop through all rectangles in the targets array and caluclate if the mouse is on top op any of these rectangles. 
}

這在IE和Firefox正常工作。

但在谷歌瀏覽器中，當我將鼠標懸停在矩形上方與矩形相同的區域中時，矩形被填充。

因爲它總是與矩形的實際位置相同，我很快發現Sys.UI.DomElement getLocation方法在Google Chrome中返回不同的值。

下面是結果：

火狐：

var location = Sys.UI.DomElement.getLocation(canvasElement); 

location.x = 545 
location.y = 297

丁目：

var location = Sys.UI.DomElement.getLocation(canvasElement); 

location.x = 544 
location.y = 94

因此，有1個像素在水平方向和位在垂直方向上超過200個像素。

現在我知道它是如何來的，當我將鼠標懸停在矩形上方的區域時，我的矩形被填充。

但當然，我想知道我應該怎麼做才能避免谷歌瀏覽器的這種行爲。

你有什麼想法嗎？

任何幫助，非常感謝。

謝謝！

更多信息：

MSDN：link

Sys.UI.DomElement的getLocation方法

獲取DOM元素相對於向左上方角落的絕對位置所有者框架或窗口。

來源

2012-05-18 ThdK

實測值使用JQuery另一種解決方案：

變種位置= $（canvasElement）.offset（）;

然後只是使用location.left和location.top

來源

2012-05-18 12:33:01 ThdK

Sys.UI.DomElment.getLocation在Google Chrome瀏覽器中返回的值不同於其他瀏覽器中的

回答

相關問題