diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/ja/web/api/pointerevent | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/ja/web/api/pointerevent')
-rw-r--r-- | files/ja/web/api/pointerevent/getcoalescedevents/index.html | 53 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/height/index.html | 63 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/index.html | 156 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/isprimary/index.html | 75 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/pointerevent/index.html | 70 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/pointerid/index.html | 70 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/pointertype/index.html | 96 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/pressure/index.html | 81 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/tangentialpressure/index.html | 78 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/tiltx/index.html | 68 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/tilty/index.html | 67 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/twist/index.html | 71 | ||||
-rw-r--r-- | files/ja/web/api/pointerevent/width/index.html | 69 |
13 files changed, 1017 insertions, 0 deletions
diff --git a/files/ja/web/api/pointerevent/getcoalescedevents/index.html b/files/ja/web/api/pointerevent/getcoalescedevents/index.html new file mode 100644 index 0000000000..3a6779b119 --- /dev/null +++ b/files/ja/web/api/pointerevent/getcoalescedevents/index.html @@ -0,0 +1,53 @@ +--- +title: PointerEvent.getCoalescedEvents() +slug: Web/API/PointerEvent/getCoalescedEvents +tags: + - API + - DOM + - Deprecated + - Method + - Pointer Events + - PointerEvent + - Reference +translation_of: Web/API/PointerEvent/getCoalescedEvents +--- +<p>{{APIRef("Pointer Events")}}{{seecompattable}}</p> + +<p>{{domxref("PointerEvent")}} インターフェイスの <strong><code>getCoalescedEvents()</code></strong> メソッドは、送出された {{event("pointermove")}} イベントに合体したすべての <code>PointerEvent</code> インスタンスのシーケンスを返します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>pointerEvents[]</em> = <em>PointerEvent</em>.getCoalescedEvents()</pre> + +<h3 id="Parameters" name="Parameters">パラメーター</h3> + +<p>なし。</p> + +<h3 id="Returns" name="Returns">Returns</h3> + +<p>{{domxref("PointerEvent")}} インスタンスのシーケンス。</p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2 Ext','#dom-pointerevent-getcoalescedevents','getCoalescedEvents()')}}</td> + <td>{{Spec2('Pointer Events 2 Ext')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_Compatibility" name="Browser_Compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.getCoalescedEvents")}}</p> diff --git a/files/ja/web/api/pointerevent/height/index.html b/files/ja/web/api/pointerevent/height/index.html new file mode 100644 index 0000000000..69c9d0dec2 --- /dev/null +++ b/files/ja/web/api/pointerevent/height/index.html @@ -0,0 +1,63 @@ +--- +title: PointerEvent.height +slug: Web/API/PointerEvent/height +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/height +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>height</code></strong> 読み取り専用プロパティは、y 軸に沿ったポインタの接触ジオメトリの高さを表します(CSS ピクセル単位)。</span> ポインタデバイスのソース(指など)によっては、特定のポインタに対して、各イベントが異なる値を生成することがあります。</p> + +<p>入力ハードウェアが接触ジオメトリをブラウザーに報告できない場合、高さのデフォルトは <code>1</code> です。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>contactHeight</em> = <em>pointerEvent</em>.height; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>contactHeight</code></dt> + <dd>イベントの接触面積の高さ(CSS ピクセル単位)。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>このプロパティの例は、<a href="/ja/docs/Web/API/PointerEvent/width#Example">PointerEvent.width の例</a>に含まれています。</p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#widl-PointerEvent-height', 'height')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#widl-PointerEvent-height', 'height')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.height")}}</p> diff --git a/files/ja/web/api/pointerevent/index.html b/files/ja/web/api/pointerevent/index.html new file mode 100644 index 0000000000..af14ec223d --- /dev/null +++ b/files/ja/web/api/pointerevent/index.html @@ -0,0 +1,156 @@ +--- +title: PointerEvent +slug: Web/API/PointerEvent +tags: + - API + - DOM + - Interface + - Pointer Events + - PointerEvent + - Reference +translation_of: Web/API/PointerEvent +--- +<p>{{ APIRef("Pointer Events") }}</p> + +<p><span class="seoSummary"><strong><code>PointerEvent</code></strong> インターフェイスは、接触点のジオメトリ、イベントを生成したデバイスタイプ、接触面に加えられた圧力の量など、ポインタによって生成された DOM イベントの状態を表します。</span></p> + +<p><em>ポインタ</em>は、入力デバイス(マウス、ペン、またはタッチ対応面上の接触点など)のハードウェアにとらわれない表現です。 ポインタは、画面などの接触面上の特定の座標(または座標のセット)をターゲットにすることができます。</p> + +<p>ポインタの<em>ヒットテスト</em>は、ブラウザーがポインタイベントのターゲット要素を決定するために使用するプロセスです。 通常、これはポインタの位置と、画面媒体上のドキュメント内の要素の視覚的なレイアウトを考慮して決定します。</p> + +<h2 id="Constructors" name="Constructors">コンストラクタ</h2> + +<dl> + <dt>{{domxref("PointerEvent.PointerEvent", "PointerEvent()")}}</dt> + <dd>信頼できない合成 <code>PointerEvent</code> を作成します。</dd> +</dl> + +<h2 id="Properties" name="Properties">プロパティ</h2> + +<p><em>このインターフェイスは、{{domxref("MouseEvent")}} および {{domxref("Event")}} からプロパティを継承します。</em></p> + +<dl> + <dt>{{ domxref('PointerEvent.pointerId')}} {{readonlyInline}}</dt> + <dd>イベントの原因となっているポインタの一意の識別子。</dd> + <dt>{{ domxref('PointerEvent.width')}} {{readonlyInline}}</dt> + <dd>ポインタの接触ジオメトリの幅(X 軸の大きさ、CSS ピクセル単位)。</dd> + <dt>{{ domxref('PointerEvent.height')}} {{readonlyInline}}</dt> + <dd>ポインタの接触ジオメトリの高さ(Y 軸上の大きさ、CSS ピクセル単位)。</dd> + <dt>{{ domxref('PointerEvent.pressure')}} {{readonlyInline}}</dt> + <dd>0 から 1 の範囲のポインタ入力の正規化された圧力。 ここで、0 と 1 は、それぞれハードウェアが検出できる最小圧力と最大圧力を表します。</dd> + <dt>{{ domxref('PointerEvent.tangentialPressure')}} {{readonlyInline}}</dt> + <dd>ポインタ入力の正規化された接線圧力(バレル圧力またはシリンダー応力(<a href="https://en.wikipedia.org/wiki/Cylinder_stress">cylinder stress</a>)とも呼ばれます)は -1 から 1 の範囲で、0 はコントロールの中立位置です。</dd> + <dt>{{ domxref('PointerEvent.tiltX')}} {{readonlyInline}}</dt> + <dd>Y-Z 平面と、ポインタ(ペン/スタイラスなど)軸と Y 軸の両方を含む平面との間の平面角度(度単位、-90 から 90 の範囲)。</dd> + <dt>{{ domxref('PointerEvent.tiltY')}} {{readonlyInline}}</dt> + <dd>X-Z 平面と、ポインタ(ペン/スタイラスなど)軸と X 軸の両方を含む平面との間の平面角度(度単位、-90 から 90 の範囲)。</dd> + <dt>{{ domxref('PointerEvent.twist')}} {{readonlyInline}}</dt> + <dd>ポインタ(ペン/スタイラスなど)の長軸を中心とした時計回りの回転の度数(0 から 359の範囲の値)。</dd> + <dt>{{ domxref('PointerEvent.pointerType')}} {{readonlyInline}}</dt> + <dd>イベントの原因となったデバイスタイプ(マウス、ペン、タッチなど)を示します。</dd> + <dt>{{ domxref('PointerEvent.isPrimary')}} {{readonlyInline}}</dt> + <dd>ポインタがこのポインタタイプのプライマリポインタを表すかどうかを示します。</dd> +</dl> + +<h2 id="Methods" name="Methods">メソッド</h2> + +<dl> + <dt>{{ domxref('PointerEvent.getCoalescedEvents()')}} {{deprecated_inline}}</dt> + <dd>送出された {{event("pointermove")}} イベントに合体したすべての <code>PointerEvent</code> インスタンスのシーケンスを返します。</dd> +</dl> + +<h2 id="Pointer_event_types" name="Pointer_event_types">ポインタイベントタイプ</h2> + +<p><code>PointerEvent</code> インターフェイスにはいくつかのイベントタイプがあります。 どのイベントが発生したかを判断するには、イベントの {{ domxref("Event.type", "type") }} プロパティを調べます。</p> + +<div class="note"><strong>注</strong>: 多くの場合、ポインタとマウスの両方のイベントが送信されることに注意することが重要です(ポインタ固有でないコードでもユーザーと対話できるようにするため)。 ポインタイベントを使用する場合は、{{ domxref("event.preventDefault()") }} を呼び出してマウスイベントも送信されないようにする必要があります。</div> + +<dl> + <dt>{{event('pointerover')}}</dt> + <dd>このイベントは、ポインティングデバイスが要素のヒットテスト境界内に移動したときに発生します。</dd> + <dt>{{event('pointerenter')}}</dt> + <dd>このイベントは、ポインティングデバイスが要素またはその子孫の1つのヒットテスト境界内に移動したときに発生します。 これには、ホバーをサポートしないデバイスからの <code>pointerdown</code> イベントの結果も含まれます(<code>pointerdown </code>を参照)。 このイベントタイプは <code>pointerover</code> に似ていますが、バブリングしないという点で異なります。</dd> + <dt>{{event('pointerdown')}}</dt> + <dd>このイベントは、ポインタが<em>アクティブ</em>になると発生します。 マウスの場合、ボタンが押されていない状態から少なくとも1つのボタンが押された状態に移行したときに発生します。 タッチの場合、物理的な接触がデジタイザとなされたときに発生します。 ペンの場合、スタイラスがデジタイザと物理的に接触したときに発生します。</dd> + <dt>{{event('pointermove')}}</dt> + <dd>このイベントは、ポインタが座標を変更したときに発生します。</dd> + <dt>{{event('pointerup')}}</dt> + <dd>このイベントは、ポインタが<em>アクティブ</em>でなくなったときに発生します。</dd> + <dt>{{event('pointercancel')}}</dt> + <dd>ブラウザーは、ポインタがイベントを生成できなくなったと判断した場合(例えば、関連するデバイスが無効になった場合)、このイベントを発生させます。</dd> + <dt>{{event('pointerout')}}</dt> + <dd>このイベントは、次のようないくつかの理由で発生します。 ポインティングデバイスが要素のヒットテスト境界外に移動した。 ホバーをサポートしていないデバイスの <code>pointerup</code> イベントが発生した(<code>pointerup</code> を参照)。 <code>pointercancel</code> イベントの発生後(<code>pointercancel</code> を参照)。 ペン/スタイラスがデジタイザで検出可能なホバー範囲を離脱したとき。</dd> + <dt>{{event('pointerleave')}}</dt> + <dd>このイベントは、ポインティングデバイスが要素のヒットテスト境界外に移動したときに発生します。 ペンデバイスの場合、このイベントは、スタイラスがデジタイザで検出可能なホバー範囲を離脱したときに発生します。</dd> + <dt>{{event('gotpointercapture')}}</dt> + <dd>このイベントは、要素がポインタキャプチャを受け取ったときに発生します。</dd> + <dt>{{event('lostpointercapture')}}</dt> + <dd>このイベントは、ポインタに対するポインタキャプチャが解放された後に発生します。</dd> +</dl> + +<h2 id="GlobalEventHandlers" name="GlobalEventHandlers">GlobalEventHandlers</h2> + +<dl> + <dt>{{ domxref('GlobalEventHandlers.onpointerover') }}</dt> + <dd>{{event('pointerover')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointerenter') }}</dt> + <dd>{{event('pointerenter')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointerdown') }}</dt> + <dd>{{event('pointerdown')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointermove') }}</dt> + <dd>{{event('pointermove')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointerup') }}</dt> + <dd>{{event('pointerup')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointercancel') }}</dt> + <dd>{{event('pointercancel')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointerout') }}</dt> + <dd> {{event('pointerout')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> + <dt>{{ domxref('GlobalEventHandlers.onpointerleave') }}</dt> + <dd>{{event('pointerleave')}} イベントのための{{domxref('GlobalEventHandlers','グローバルイベントハンドラ')}}。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>各プロパティ、イベントタイプ、およびグローバルイベントハンドラの例は、それぞれの参照ページに含まれています。</p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2 Ext','#extensions-to-the-pointerevent-interface', 'PointerEvent')}}</td> + <td>{{Spec2('Pointer Events 2 Ext')}}</td> + <td>{{DOMxRef('PointerEvent.getCoalescedEvents()', 'getCoalescedEvents()')}} メソッドを追加しました。</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#pointerevent-interface', 'PointerEvent')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>{{DOMxRef('PointerEvent.twist', 'twist')}} プロパティと {{DOMxRef('PointerEvent.tangentialPressure', 'tangentialPressure')}} プロパティを追加しました。</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#pointerevent-interface', 'PointerEvent')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + + + +<p>{{Compat("api.PointerEvent")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{ domxref("Touch_events","Touch Events") }}</li> + <li>{{ domxref("GestureEvent") }}</li> + <li>{{ domxref("MSGestureEvent") }}</li> + <li>{{cssxref("touch-action")}}</li> +</ul> diff --git a/files/ja/web/api/pointerevent/isprimary/index.html b/files/ja/web/api/pointerevent/isprimary/index.html new file mode 100644 index 0000000000..ce7346a3bd --- /dev/null +++ b/files/ja/web/api/pointerevent/isprimary/index.html @@ -0,0 +1,75 @@ +--- +title: PointerEvent.isPrimary +slug: Web/API/PointerEvent/isPrimary +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/isPrimary +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>isPrimary</code></strong> 読み取り専用プロパティは、イベントを作成したポインタデバイスが<em>プライマリ</em>ポインタであるかどうかを示します。</span> イベントの発生原因となったポインタがプライマリデバイスの場合は <code>true</code> を返し、それ以外の場合は <code>false</code> を返します。</p> + +<p>マルチポインタのシナリオ(複数のタッチ点をサポートするタッチ画面など)では、このプロパティを使用して、各ポインタタイプのアクティブポインタのセットから<em>マスタポインタ</em>を識別します。 プライマリポインタのみが<em>互換性マウスイベント</em>を生成します。 単一のポインタによる相互作用のみを希望する作成者は、非プライマリポインタを無視することによってそれを達成することができます。</p> + +<p>マウスデバイスを表すポインタの場合、ポインタはプライマリと見なされます。 ペン入力を表す他のアクティブポインタが存在しないときに、その {{event("pointerdown")}} イベントが送出された場合、ペン入力を表すポインタはプライマリペン入力と見なされます。 タッチ入力を表す他のアクティブポインタが存在しないときに、その {{event("pointerdown")}} イベントが送出された場合、タッチ入力を表すポインタはプライマリタッチ入力と見なされます。</p> + +<p>2つ以上のポインタデバイスタイプが同時に使用されている場合、複数のポインタ(各 {{domxref("PointerEvent.pointerType", "pointerType")}} に1つ)がプライマリと見なされます。 例えば、タッチ接触とマウスカーソルが同時に動かされると、両方ともプライマリと見なされるポインタが生成されます。 複数のプライマリポインタがある場合、これらのポインタはすべて<em>互換性マウスイベント</em>を生成します(ポインタ、マウス、およびタッチの相互作用の詳細については、{{domxref("Pointer events")}} を参照)。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>isPrimary</em> = <em>pointerEvent</em>.isPrimary; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>isPrimary</code></dt> + <dd>このイベントのポインタがプライマリポインタの場合は <code>true</code> を返し、そうでない場合は <code>false</code> を返します。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>この例は、<code>isPrimary</code> の値を使用して適切な処理関数を呼び出す方法を示しています。</p> + +<pre class="brush: js">target.addEventListener('pointerdown', function(event) { + if (event.isPrimary) + process_primary_pointer(event); + else + process_secondary_pointer(event); + }, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#widl-PointerEvent-isPrimary', 'isPrimary')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#widl-PointerEvent-isPrimary', 'isPrimary')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.isPrimary")}}</p> diff --git a/files/ja/web/api/pointerevent/pointerevent/index.html b/files/ja/web/api/pointerevent/pointerevent/index.html new file mode 100644 index 0000000000..78e10d6d34 --- /dev/null +++ b/files/ja/web/api/pointerevent/pointerevent/index.html @@ -0,0 +1,70 @@ +--- +title: PointerEvent.PointerEvent() +slug: Web/API/PointerEvent/PointerEvent +tags: + - API + - Constructor + - PointerEvent + - Reference +translation_of: Web/API/PointerEvent/PointerEvent +--- +<p>{{APIRef("Pointer Events")}}</p> + +<p><span class="seoSummary"><strong><code>PointerEvent()</code></strong> コンストラクタは、新しい信頼できない合成 {{domxref("PointerEvent")}} オブジェクトのインスタンスを作成します。</span></p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"> <em>event</em> = new PointerEvent(<em>type</em>, <em>PointerEventInit</em>);</pre> + +<h3 id="Arguments" name="Arguments">引数</h3> + +<dl> + <dt><em>type</em></dt> + <dd>イベントの名前を表す {{domxref("DOMString")}} です(<a href="/Web/API/PointerEvent#Pointer_event_types"><code>PointerEvent</code> のイベントタイプ</a>を参照)。</dd> + <dt><em>PointerEventInit</em>{{optional_inline}}</dt> +</dl> + +<dl> + <dd>次のフィールドを持つ <code>PointerEventInit</code> ディクショナリです。 + + <ul> + <li><code>pointerId</code> — インスタンスの {{domxref("PointerEvent.pointerId")}} の値を設定する <code>long</code> 型のオプションで、デフォルトは <code>0</code> です。</li> + <li><code>width</code> — インスタンスの {{domxref("PointerEvent.width")}} の値を設定する <code>double</code> 型のオプションで、デフォルトは <code>1</code> です。</li> + <li><code>height</code> — インスタンスの {{domxref("PointerEvent.height")}} の値を設定する <code>double</code> 型のオプションで、デフォルトは <code>1</code> です。</li> + <li><code>pressure</code> — インスタンスの {{domxref("PointerEvent.pressure")}} の値を設定する <code>float</code> 型のオプションで、デフォルトは <code>0</code> です。</li> + <li><code>tangentialPressure</code> — インスタンスの {{domxref("PointerEvent.tangentialPressure")}} の値を設定する <code>float</code> 型のオプションで、デフォルトは <code>0</code> です。</li> + <li><code>tiltX</code> — インスタンスの {{domxref("PointerEvent.tiltX")}} の値を設定する <code>long</code> 型のオプションで、デフォルトは <code>0</code> です。</li> + <li><code>tiltY</code> — インスタンスの {{domxref("PointerEvent.tiltY")}} の値を設定する <code>long</code> 型のオプションで、デフォルトは <code>0</code> です。</li> + <li><code>twist</code> — インスタンスの {{domxref("PointerEvent.twist")}} の値を設定する <code>long</code> 型のオプションで、デフォルトは <code>0</code> です。</li> + <li><code>pointerType</code> — インスタンスの {{domxref("PointerEvent.pointerType")}} の値を設定する {{domxref("DOMString")}} 型のオプションで、デフォルトは <code>""</code> です。</li> + <li><code>isPrimary</code> — インスタンスの {{domxref("PointerEvent.isPrimary")}} の値を設定する {{jsxref("Boolean")}} 型のオプションで、デフォルトは <code>false</code> です。</li> + </ul> + + <div class="note"> + <p><strong>注</strong>: <code>PointerEventInit</code> ディクショナリは、{{domxref("MouseEvent.MouseEvent","MouseEvent")}}、{{domxref("UIEvent.UIEvent", "UIEventInit")}}、および {{domxref("Event.Event", "EventInit")}} ディクショナリからのフィールドも受け入れます。</p> + </div> + </dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<pre class="brush: js">var moveEvent = new PointerEvent("pointermove"); + +var downEvent = new PointerEvent("pointerdown", + {pointerId: 1, + bubbles: true, + cancelable: true, + pointerType: "touch", + width: 100, + height: 100, + isPrimary: true + }); +</pre> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.PointerEvent")}}</p> diff --git a/files/ja/web/api/pointerevent/pointerid/index.html b/files/ja/web/api/pointerevent/pointerid/index.html new file mode 100644 index 0000000000..7dee6bc465 --- /dev/null +++ b/files/ja/web/api/pointerevent/pointerid/index.html @@ -0,0 +1,70 @@ +--- +title: PointerEvent.pointerId +slug: Web/API/PointerEvent/pointerId +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/pointerId +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>pointerId</code></strong> 読み取り専用プロパティは、特定のポインタのイベントに割り当てられた識別子です。</span> 識別子は一意であり、他のすべてのアクティブポインタのイベントの識別子とは異なります。 値はランダムに生成される可能性があるため、特定の意味を伝えることは保証されません。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>id</em> = <em>pointerEvent</em>.pointerId; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>id</code></dt> + <dd>ポインタイベントの一意の識別子番号。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>次のコードスニペットは、以前に保存された <code>pointerId</code> と、発生したばかりの {{event("pointerdown")}} イベントのものとを比較します。</p> + +<pre class="brush: js">let id; // これが以前に保存された pointerId であると仮定しましょう + +target.addEventListener('pointerdown', function(event) { + // キャッシュされた前のイベントの ID を現在の + // イベントの ID と比較し、それに応じて処理する + if (id === event.pointerId) process_event(event); +}, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-pointerid', 'pointerId')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#dom-pointerevent-pointerid', 'pointerId')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.pointerId")}}</p> diff --git a/files/ja/web/api/pointerevent/pointertype/index.html b/files/ja/web/api/pointerevent/pointertype/index.html new file mode 100644 index 0000000000..7d2ce28a48 --- /dev/null +++ b/files/ja/web/api/pointerevent/pointertype/index.html @@ -0,0 +1,96 @@ +--- +title: PointerEvent.pointerType +slug: Web/API/PointerEvent/pointerType +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/pointerType +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>pointerType</code></strong> 読み取り専用プロパティは、特定のポインタイベントを引き起こしたデバイスタイプ(マウス、ペン、またはタッチ)を示します。</span></p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>pType</em> = <em>pointerEvent</em>.pointerType; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>pType</code></dt> + <dd>イベントのポインタタイプ。 サポートする値は次の文字列です。<br> + + <dl> + <dt><code>"mouse"</code></dt> + <dd>イベントはマウスデバイスによって生成されました。</dd> + <dt><code>"pen"</code></dt> + <dd>イベントはペンデバイスまたはスタイラスデバイスによって生成されました。</dd> + <dt><code>"touch"</code></dt> + <dd>イベントは指などのタッチによって生成されました。</dd> + </dl> + </dd> +</dl> + +<p>デバイスタイプがブラウザーで検出できない場合、値は空の文字列(<code>""</code>)になります。 ブラウザーが上記以外のポインタデバイスタイプをサポートしている場合は、異なるタイプのデバイスと名前が競合しないように、値に<em>{{glossary("Vendor Prefix","ベンダー接頭辞")}}を付ける</em>必要があります。</p> + +<h2 id="Example" name="Example">例</h2> + +<p>この例は、<code>pointerType</code> プロパティの値を使用して適切なポインタタイプ処理関数を呼び出す方法を示しています。</p> + +<pre class="brush: js">targetElement.addEventListener('pointerdown', function(event) { + // 適切なポインタタイプのハンドラを呼び出す + switch (event.pointerType) { + case 'mouse': + process_pointer_mouse(event); + break; + case 'pen': + process_pointer_pen(event); + break; + case 'touch': + process_pointer_touch(event); + break; + default: + console.log(`pointerType ${event.pointerType} はサポートしていません`); + } +}, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#dom-pointerevent-pointertype', 'pointerType')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-pointertype', 'pointerType')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('CSSOM View','#extensions-to-the-mouseevent-interface', 'MouseEvent')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>{{domxref("MouseEvent")}} を <code>long</code> 型から <code>double</code> 型に再定義します。 これは、<code>pointerType</code> がマウスである {{domxref("PointerEvent")}} が <code>double</code> 型になることを意味します。</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.pointerType", 2)}}</p> diff --git a/files/ja/web/api/pointerevent/pressure/index.html b/files/ja/web/api/pointerevent/pressure/index.html new file mode 100644 index 0000000000..d2f4d3635c --- /dev/null +++ b/files/ja/web/api/pointerevent/pressure/index.html @@ -0,0 +1,81 @@ +--- +title: PointerEvent.pressure +slug: Web/API/PointerEvent/pressure +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/pressure +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>pressure</code></strong> 読み取り専用プロパティは、ポインタ入力の正規化された圧力を示します。</span></p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>pressure</em> = <em>pointerEvent</em>.pressure; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>pressure</code></dt> + <dd><code>0</code> から <code>1</code> までの範囲のポインタ入力の正規化された圧力。 ここで、<code>0</code> と <code>1</code> は、それぞれハードウェアが検出できる最小圧力と最大圧力を表します。 マウスなど、圧力をサポートしていないハードウェアの場合、値はポインタがアクティブボタン状態のときは <code>0.5</code>、それ以外のときは <code>0</code> です。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>このスニペットでは、{{event("pointerdown")}} イベントが発生すると、そのイベントの <code>pressure</code> プロパティの値に応じてさまざまな関数が呼び出されます。</p> + +<pre class="brush: js">someElement.addEventListener('pointerdown', function(event) { + if (event.pressure == 0) { + // 圧力なし + process_no_pressure(event); + } else if (event.pressure == 1) { + // 最大圧力 + process_max_pressure(event); + } else { + // デフォルト + process_pressure(event); + } +}, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-pressure', 'pressure')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#dom-pointerevent-pressure', 'pressure')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.pressure")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{ domxref("Touch.force") }}</li> +</ul> diff --git a/files/ja/web/api/pointerevent/tangentialpressure/index.html b/files/ja/web/api/pointerevent/tangentialpressure/index.html new file mode 100644 index 0000000000..31b3c2e265 --- /dev/null +++ b/files/ja/web/api/pointerevent/tangentialpressure/index.html @@ -0,0 +1,78 @@ +--- +title: PointerEvent.tangentialPressure +slug: Web/API/PointerEvent/tangentialPressure +tags: + - API + - DOM + - Pointer Events + - PointerEvent + - Property + - Reference + - tangentialPressure +translation_of: Web/API/PointerEvent/tangentialPressure +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>tangentialPressure</code></strong> 読み取り専用プロパティは、ポインタ入力の正規化された接線方向の圧力(バレル圧力またはシリンダー応力(<a href="https://en.wikipedia.org/wiki/Cylinder_stress">cylinder stress</a>)とも呼ばれます)を表します。</span></p> + +<p>(訳注:エアブラシスタイラスのホイールのようなものを想定しています。)</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>tanPressure</em> = <em>pointerEvent</em>.tangentialPressure; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>ポインタ入力の正規化された接線方向の圧力を表す <code>-1</code> から <code>1</code> の範囲の <code>float</code> 型。ここで、<code>0</code> はコントロールの中立位置です。</p> + +<p>ハードウェアによっては、<code>0</code> から <code>1</code> の範囲の正の値しかサポートしない場合があることに注意してください。 接線方向の圧力をサポートしないハードウェアの場合、値は <code>0</code> になります。</p> + +<h2 id="Example" name="Example">例</h2> + +<p>このスニペットでは、{{event("pointerdown")}} イベントが発生すると、イベントの <code>tangentialPressure</code> プロパティの値に応じてさまざまな関数が呼び出されます。</p> + +<pre class="brush: js">someElement.addEventListener('pointerdown', function(event) { + if (event.tangentialPressure == 0) { + // 圧力なし + process_no_tanPressure(event); + } else if (event.tangentialPressure == 1) { + // 最大圧力 + process_max_tanPressure(event); + } else { + // デフォルト + process_tanPressure(event); + } +}, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-tangentialpressure', 'tangentialPressure')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.tangentialPressure")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{ domxref("Touch.force") }}</li> +</ul> diff --git a/files/ja/web/api/pointerevent/tiltx/index.html b/files/ja/web/api/pointerevent/tiltx/index.html new file mode 100644 index 0000000000..527818b8c3 --- /dev/null +++ b/files/ja/web/api/pointerevent/tiltx/index.html @@ -0,0 +1,68 @@ +--- +title: PointerEvent.tiltX +slug: Web/API/PointerEvent/tiltX +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/tiltX +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>tiltX</code></strong> 読み取り専用プロパティは、ポインタの <em>Y-Z 平面</em>と画面との間の角度(度単位)です。</span> このプロパティは通常、ペン/スタイラスポインタタイプにのみ役立ちます。</p> + +<p>このプロパティの説明については、<a href="https://w3c.github.io/pointerevents/#dom-pointerevent-tiltx">仕様の図 2</a> を参照してください。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>tilt</em>X = pointerEvent.<em>tiltX</em>; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>tiltX</code></dt> + <dd>ポインタ(スタイラス)の Y-Z 平面と画面の間の角度(度単位)。 値の範囲は <code>-90</code> から <code>90</code> です。 ここで、正の値は右への傾きです。 このプロパティをサポートしていないデバイスの場合、値は <code>0</code> です。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>この例は、<code>tiltX</code> プロパティおよび {{domxref("PointerEvent.tiltY","tiltY")}} プロパティへの簡単なアクセスを示しています。</p> + +<pre class="brush: js">someElement.addEventListener("pointerdown", function(event) { + process_tilt(event.tiltX, event.tiltY); +}, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-tiltx', 'tiltX')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#dom-pointerevent-tiltx', 'tiltX')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.tiltX")}}</p> diff --git a/files/ja/web/api/pointerevent/tilty/index.html b/files/ja/web/api/pointerevent/tilty/index.html new file mode 100644 index 0000000000..4dfe6ac2d2 --- /dev/null +++ b/files/ja/web/api/pointerevent/tilty/index.html @@ -0,0 +1,67 @@ +--- +title: PointerEvent.tiltY +slug: Web/API/PointerEvent/tiltY +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/tiltY +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>tiltY</code></strong> 読み取り専用プロパティは、ポインタの <em>X-Z 平面</em>と画面の間の角度(度単位)です。 このプロパティは通常、ペン/スタイラスポインタタイプにのみ役立ちます。</span></p> + +<p>このプロパティの説明については、<a href="https://w3c.github.io/pointerevents/#dom-pointerevent-tilty">仕様の図 3</a> を参照してください。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>tiltY</em> = pointerEvent.<em>tiltY</em>; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>tiltY</code></dt> + <dd>ポインタ(スタイラス)の X-Z 平面と画面の間の角度(度単位)。 値の範囲は <code>-90</code> から <code>90</code> です。 ここで、正の値はユーザーの方への傾きです。 このプロパティをサポートしていないデバイスの場合、値は <code>0</code> です。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>この例は、{{domxref("PointerEvent.tiltX","tiltX")}} プロパティおよび <code>tiltY</code> プロパティへの簡単なアクセスを示しています。</p> + +<pre class="brush: js">someElement.addEventListener("pointerdown", function(event) { + process_tilt(event.tiltX, event.tiltY); +}, false);</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-tilty', 'tiltY')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#dom-pointerevent-tilty', 'tiltY')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.tiltY")}}</p> diff --git a/files/ja/web/api/pointerevent/twist/index.html b/files/ja/web/api/pointerevent/twist/index.html new file mode 100644 index 0000000000..b8830ce906 --- /dev/null +++ b/files/ja/web/api/pointerevent/twist/index.html @@ -0,0 +1,71 @@ +--- +title: PointerEvent.twist +slug: Web/API/PointerEvent/twist +tags: + - API + - DOM + - Pointer Events + - PointerEvent + - Property + - Reference + - twist +translation_of: Web/API/PointerEvent/twist +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>twist</code></strong> 読み取り専用プロパティは、ポインタ(例えばペン/スタイラス)の主軸を中心とした時計回りの回転を度数で表します。</span></p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>twist</em> = <em>pointerEvent</em>.twist; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>トランスデューサ(ポインタ)に適用される、ねじれの量を度数で表す <code>long</code> 値。 値の範囲は <code>0</code> から <code>359</code> です。 <code>twist</code> を報告しないデバイスの場合、値は <code>0</code> です。</p> + +<h2 id="Example" name="Example">例</h2> + +<p>{{event("pointerdown")}} イベントが発生すると、イベントの <code>twist</code> プロパティの値に応じてさまざまな関数が呼び出されます。</p> + +<pre class="brush: js">someElement.addEventListener('pointerdown', function(event) { + if (event.twist == 0) { + // ねじれなし + process_no_twist(event); + } else { + // デフォルト + process_twist(event); + } +}, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#dom-pointerevent-twist', 'twist')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.twist")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{ domxref("Touch.force") }}</li> +</ul> diff --git a/files/ja/web/api/pointerevent/width/index.html b/files/ja/web/api/pointerevent/width/index.html new file mode 100644 index 0000000000..e6c160a4ea --- /dev/null +++ b/files/ja/web/api/pointerevent/width/index.html @@ -0,0 +1,69 @@ +--- +title: PointerEvent.width +slug: Web/API/PointerEvent/width +tags: + - API + - DOM + - Interface + - PointerEvent + - Property + - Reference +translation_of: Web/API/PointerEvent/width +--- +<div>{{ APIRef("Pointer Events") }}</div> + +<p><span class="seoSummary">{{domxref("PointerEvent")}} インターフェイスの <strong><code>width</code></strong> 読み取り専用プロパティは、CSS ピクセルで測定された、x 軸に沿ったポインタの接触ジオメトリの幅を表します。</span> ポインタデバイスのソース(指など)に応じて、特定のポインタに対して、各イベントは異なる値を生成することがあります。</p> + +<p>入力ハードウェアが接触ジオメトリをブラウザーに報告できない場合、幅のデフォルトは <code>1</code> です。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox">var <em>contactWidth</em> = <em>pointerEvent</em>.width; +</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<dl> + <dt><code>contactWidth</code></dt> + <dd>イベントの接触面積の幅(CSS ピクセル単位)。</dd> +</dl> + +<h2 id="Example" name="Example">例</h2> + +<p>この例では、{{domxref("PointerEvent")}} インターフェイスの {{domxref("PointerEvent.width","width")}} プロパティと {{domxref("PointerEvent.height","height")}} プロパティを使用して接触面積を計算する方法を示します。</p> + +<pre class="brush: js">target.addEventListener("pointerdown", function(ev) { + // 接触面積を計算する + var area = ev.width * ev.height; + }, false); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状態</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2','#widl-PointerEvent-width', 'width')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>不安定版</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#widl-PointerEvent-width', 'width')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>初期定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.PointerEvent.width")}}</p> |