最終更新:2015-07-07 (火) 12:42:42 (3209d)  

Touch Events
Top / Touch Events

http://www.w3.org/TR/touch-events/

JavaScript/イベント

↑

例 

var obj = document.getElementById('id');
obj.addEventListener('touchmove', function(event) {
  // If there's exactly one finger inside this element
  if (event.targetTouches.length == 1) {
    var touch = event.targetTouches[0];
    // Place element where the finger is
    obj.style.left = touch.pageX + 'px';
    obj.style.top = touch.pageY + 'px';
  }
}, false);
↑

クラス

↑

TouchEvent

↑

TouchList

↑

Touch

  • clientX: クライアント領域（viewport）に対するX座標
  • clientY: クライアント領域（viewport）に対するY座標
  • screenX: 画面の表示領域に対する指のX座標
  • screenY: 画面の表示領域に対する指のX座標
  • pageX: ページ全体に対する指のX座標（スクロールを必要とする領域も含む、ということです）
  • pageY: ページ全体に対する指のX座標
  • target: タッチイベントが発生したノード
  • identifier: それぞれのタッチイベントに対する、ユニークな値
↑

対応

↑

メモ

  • touch, mouse 両方のイベントに反応することがある。
  • touchが先でmouseが後。
  • touchでpreventDefaultするとmouseは発行しない。
↑

参考

↑

関連




検索：