layerkit/layerYの代わりに、Webkitでは非推奨となっているものを使用しますか？

Question

クロム・カナリアでは、layerXとlayerYは廃止されましたが、代わりに何を使用する必要がありますか？

私はoffsetXを見つけましたが、Firefoxでは動作しません。 Webkitで警告なしにlayerXを取得するには、私はそれをしました：

var x = evt.offsetX || evt.layerX, 
    y = evt.offsetY || evt.layerY; 

これはかなり複雑なようです！それは本当にすべてのブラウザでlayerXを動作させるために行うべきことですか？

マウスの位置を検出する

Answer 1

クリックイベントからlayerXとlayerYを計算する関数である。これを作るために使用される二つの機能を指摘してステュコックスへ

function getOffset(evt) { 
    var el = evt.target, 
     x = 0, 
     y = 0; 

    while (el && !isNaN(el.offsetLeft) && !isNaN(el.offsetTop)) { 
    x += el.offsetLeft - el.scrollLeft; 
    y += el.offsetTop - el.scrollTop; 
    el = el.offsetParent; 
    } 

    x = evt.clientX - x; 
    y = evt.clientY - y; 

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

どうもありがとうございました。

Answer 2

ザのみ適度クロスブラウザーの方法（ウィンドウに対して）clientX/clientXているに、screenX/screenY（画面全体に対する）及びpageX/pageY（文書に対して、しかし以下IE8でサポートされていません）。

Quirksmodeは相対ツー文書の値に標準化するため、このことを示唆している：

function doSomething(e) { 
    var posx = 0; 
    var posy = 0; 
    if (!e) var e = window.event; 
    if (e.pageX || e.pageY)  { 
     posx = e.pageX; 
     posy = e.pageY; 
    } 
    else if (e.clientX || e.clientY)  { 
     posx = e.clientX + document.body.scrollLeft 
      + document.documentElement.scrollLeft; 
     posy = e.clientY + document.body.scrollTop 
      + document.documentElement.scrollTop; 
    } 
    // posx and posy contain the mouse position relative to the document 
    // Do something with this information 
} 

次に、あなたがあなたの要素に対するその位置をうまくthisを使用することができます。

恐ろしい私は知っていますが、インターネットは恐ろしい場所です。ここで

Answer 3

layerXとlayerYは廃止予定ですか？

のWebKitとMozillaで起こって多くの議論ががあります：

https://bugs.webkit.org/show_bug.cgi?id=21868彼らは関連するプロパティoffsetXとoffsetYは、他のブラウザで実装されていない主な理由は、まだそこにある私の経験で

https://bugzilla.mozilla.org/show_bug.cgi?id=674292 簡単に言えば、削除するかどうかは分からないので、今は削除しません。

IEのバージョンでは、xプロパティとyプロパティにマップされたエイリアスが提供されています（「評判がない」ため、スタックオーバーフローによってさらにリンクを投稿することはできません）。