0

私はAdobeEdgeAnimateを使用してWebサイトの大部分を作成していますが、モバイルバージョンも作成したいので、明らかにonClickイベントの代わりにonTouchイベントを使用したいと思います。タッチイベントの使い方については、これまで使ったことがないので、良い情報が見つからないようです。

左にスワイプすると順方向に再生され、右にスワイプすると逆方向に再生されるシンプルな画像ギャラリーを作成したいと思います。

ここでの大きな問題は、スワイプの方向に基づいてさまざまなことを行うようにタッチイベントにどのように指示するかです。

4

1 に答える 1

0

まず第一に、その通りです。あなたは touchstart、touchmove、touchend の 3 つのイベント ハンドラーを使用したいと考えています。

1 つの方法は、ユーザーの指の開始位置と終了位置を比較することです。コードは検出する指の数によって異なりますが、適応できる基本的な方法の概要を説明します。1 本の指を検出するには、「touchstart」イベント ハンドラに次のように入力します。

var xStart = e.originalEvent.touches[0].pageX;
sym.setVariable('xStart', xStart);

これにより、最初の指の開始 x 位置が変数に格納され、他のイベント ハンドラーからグローバルにアクセスできるようになります。次に、「touchend」イベントハンドラーで同じことを行うかもしれません。ロジックを使用して 2 つの値を比較します。

xStart = sym.getVariable('xStart');
var xEnd = e.originalEvent.touches[0].pageX;

if (xEnd > xStart)
{
    sym.playReverse();
}
else if (xEnd < xStart)
{
    sym.play();
}

次に、それらの画像を保持するための停止フレームがいくつかあります。

これはほんの一例ですが、参考になれば幸いです。幸運を！

于 2013-02-28T02:09:10.550 に答える