0

グーグルクロームのキャンバス要素に問題があります。

複数の長方形が描かれたキャンバスがあります。私は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.DomElementgetLocationメソッドがGoogleChromeで異なる値を返すことがすぐにわかりました。

結果は次のとおりです。

Firefox：

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：リンク

Sys.UI.DomElementgetLocationメソッド

所有者のフレームまたはウィンドウの左上隅を基準にしたDOM要素の絶対位置を取得します。

4

1 に答える 1

0

JQueryを使用して別の解決策を見つけました：

var location = $（canvasElement）.offset（）;

次に、location.leftとlocation.topを使用します

于 2012-05-18T12:33:01.623 に答える