ポインタイベント
以前は、Web 上のポインティング デバイスはマウスでしたが、現在はタッチ スクリーンやスタイラス ペンなどの新しいデバイスが増えています。マウス イベントの使用は、これらのデバイス イベント モデルを満たさなくなりました。
ポインター イベント - ポインター イベントは、ポインティング デバイスによってトリガーできる DOM イベントの一種です。統合された DOM イベント モデルです。これらのイベントは、汎用ポインター入力を処理するために必要です。
ポインター - 画面上の特定の座標セットを明確に指すことができるハードウェア デバイスを指します。
PointerEventインターフェイスは、MouseEventすべてのプロパティとメソッドを から継承します。
イベントタイプ
ほとんどの場合、ポインター イベントとマウス イベントが送信されることに注意してください。ポインター イベントを使用する場合は、マウス イベントの送信を避けるためにevent.preventDefault()これを。
pointeroverポインタが要素のヒットテストされたエッジ間を移動したときに発生するイベント。pointerenterポインタが要素またはその子孫のヒット検出境界に移動すると発生します。泡立たないpointerdownポインタがアクティブなときに発生します。マウスの場合、ボタンがない状態からボタンがクリックされるまでトリガーされます。pointermoveポインタが座標を変更すると発生します。pointerupポインタがアクティブでなくなったときに発火しますpointercancelブラウザは、ポインターがイベントを生成できなくなったと判断し、このイベントをトリガーします。テスト中、このイベントは、div が境界までスクロールしたときにトリガーされました。pointeroutポインタが要素のヒット検出境界の外側に移動します。ポインティング デバイスのホバー イベントはサポートされていません。pointercancel事件の後。スタイラスがホバー範囲を離れるpointerleaveポインタが要素のヒット検出境界の外に移動するgotpointercaptureこのイベントは、要素がポインター キャプチャを受信したときにトリガーされます。lostpointercaptureこのイベントは、ポインターのキャプチャが解放されたときにトリガーされます。
PointerEventインターフェース
PointerEventインターフェイスは、ポインターによって発生した DOM イベントの状態を表します。
属性
pointerIdRO 番号 イベントをトリガーしたポインターの一意の識別子。他のすべての取得されたポインター イベントとは異なる一意の識別子です。この値はランダムに生成され、特定の意味はありません。widthRO 番号 X 軸上のポインタの接触ジオメトリの幅。例えば、指の腹で画面をタッチするとタッチ面が形成され、このタッチ面の幅がCSSピクセル幅となります。heightRO 番号 X 軸上のジオメトリに触れるポインターの高さ。たとえば、指の腹で画面をタッチするとタッチ面が形成され、このタッチ面の高さが CSS ピクセルの高さになります。pressureRO フロートの圧力範囲は 0 ～ 1。圧力をサポートしていないデバイスのアクティブ状態は 0.5、それ以外の場合は 0 です。tangentialPressureRO 浮動小数点 [-1,1]tiltXRO 入力デバイスと Y 軸によって形成される平面と YZ 平面との間の角度 [-90,90]tiltYRO 入力デバイスと X 軸によって形成される平面と XZ 平面との間の角度 [-90,90]twistRO デバイスの主軸を中心とした時計回りの回転角度を入力します。[0,359]pointerTypeRO はイベントをトリガーしたデバイスのタイプを表します。テスト中はタッチ、マウスが使用されましたが、スタイラスは使用されませんでした。isPrimaryRO は、ポインタが現在のデバイス タイプのプライマリ ポインタであるかどうかを識別します。真実。これは、メイン ポインタのみがマウス イベントと互換性があり、シングル ポインタ操作のみが必要な場合は他のポインタをフィルタリングして除外できるため、マルチタッチ タッチ スクリーンで役立ちます。