タッチ入力やその他の入力によるスクロールとズーム

Windows 8.1 の Internet Explorer 11 は、Windows 8 の Internet Explorer 10 や Windows ストア アプリで導入されたタッチによるスクロールやズームに、他の種類の入力 (タッチパッド、マウス、キーボードなど) のサポートと、アニメーション化されたスクロールやズームの効果についての新しいメソッドを追加することによって微調整されたコントロールに基づいて構築されています。:

重要  Windows 7 の Internet Explorer 11 では、この機能はサポートされていません。

この機能は、Windows Direct Manipulation API で提供されますが、Web ページやアプリに対しては、一連の CSS プロパティと、DOM プロパティやメソッド (msContentZoomFactormsZoomTo など) によって公開されます。Direct Manipulation によって、システムはタッチ入力を処理し、デリゲート スレッドで組み込みの対話型フィードバック アニメーションを提供できるため、UI スレッドで Web アプリのスクリプトやスクリプト駆動型アニメーションに対する応答を処理する必要がなくなります。

msZoomTo メソッド

新しい msZoomTo メソッドは、アニメーションを使って指定された座標に要素をスクロールまたはズームします。これにより、簡単で効率的な方法で、JavaScript を使った Web サイトや Windows ストア アプリで、アニメーション化されたスクロールによるナビゲーションを実装したり、セマンティック ズーム効果を実現したりすることができます。 JavaScript を使った Windows ストア アプリでは、FlipView コントロール、アプリ バー、および改ページ調整のシナリオで使われます。

たとえば、msZoomTo を使うと、要素をビューポートの中央から動かさずに拡大することができます。


var args = {
    contentX: target.offsetLeft + target.offsetWidth/2;
    contentY: target.offsetTop + target.offsetHeight/2;
    scaleFactor: 2.0;
}
zoomer.msZoomTo(args); 


さまざま入力デバイスで微調整されたスクロール、パン、およびズーム

Internet Explorer 11 では、Windows 8 の Internet Explorer 10 で導入されたきめ細かな制御が可能なタッチによるスクロールやズームのための CSS プロパティと DOM プロパティで新しい入力の種類がサポートされています。具体的には、Internet Explorer 11 では次のサポートが追加されています。

  • マウス、キーボード、およびタッチパッドでのスクロール/パンのスナップ位置のサポート
  • タッチパッド操作でのスクロール レールとズームのチェーン、制限、およびスナップ位置のサポート

既にこれらのプロパティを使っている場合、Internet Explorer 11 で追加されたこのサポートは、既存のコードを変更しなくても機能します。

さまざまな入力方法やバージョンでのカスタム スクロールおよびズーム プロパティのサポートの概要を以下に示します。

スクロール/ズームのプロパティ:タッチスクリーンタッチパッドマウスキーボード
-ms-scroll-snap-points-x-ms-scroll-snap-points-y-ms-scroll-snap-type-ms-scroll-snap-x-ms-scroll-snap-y Internet Explorer 10 以上Internet Explorer 11Internet Explorer 11Internet Explorer 11
-ms-content-zoom-chainingmsContentZoomFactor-ms-content-zooming-ms-content-zoom-limit-ms-content-zoom-limit-max-ms-content-zoom-limit-min-ms-content-zoom-snap-ms-content-zoom-snap-points-ms-content-zoom-snap-type-ms-scroll-chaining-ms-scroll-rails Internet Explorer 10 以上Internet Explorer 11----
-ms-overflow-style-ms-scroll-limit-ms-scroll-limitXMax-ms-scroll-limitXMin-ms-scroll-limitYMax-ms-scroll-limitYMin Internet Explorer 10 以上Internet Explorer 10 以上Internet Explorer 10 以上Internet Explorer 10 以上
-ms-scroll-translation ----Internet Explorer 10 以上--

 

関連トピック

msZoomTo
IE10 開発者向けガイド: タッチ操作によるスクロールとズーム
IE11: 現在そして将来の Web に対応するタッチ ブラウズ
no タッチ入力によるスクロール、パン、ズームに関するサンプル
Touch: Zooming and Panning (API Reference)

 

 

表示:
© 2014 Microsoft