0

スワイプ ジェスチャを Web ページ全体に統合したいと考えています。トリガーはラッパー div 全体になり、ターゲットは別の html ファイルになります。各htmlで、左右にスワイプするためのhtmlリンクを設定したいと思います。上下の必要はありません。

私はjQueryモバイル開発を見てきましたが、それはうまくいきません:(

4

2 に答える 2

1

これは、いくつかのアプリケーションで使用しているタッチスクリーンのドラッグ/スワイプの修正です。

(function(b)
{
b.support.touch = "ontouchend" in document;
if (!b.support.touch)
{
    return;
}
var c = b.ui.mouse.prototype,
    e = c._mouseInit,
    a;
function d(g, h)
{
    if (g.originalEvent.touches.length > 1)
    {
        return;
    }
    g.preventDefault();
    var i = g.originalEvent.changedTouches[0],
        f = document.createEvent("MouseEvents");
    f.initMouseEvent(h, true, true, window, 1, i.screenX, i.screenY, i.clientX, i.clientY, false, false, false, false, 0, null);
    g.target.dispatchEvent(f);
}
c._touchStart = function(g)
{
    var f = this;
    if (a || !f._mouseCapture(g.originalEvent.changedTouches[0]))
    {
        return;
    }
    a = true;
    f._touchMoved = false;
    d(g, "mouseover");
    d(g, "mousemove");
    d(g, "mousedown");
};
c._touchMove = function(f)
{
    if (!a)
    {
        return;
    }
    this._touchMoved = true;
    d(f, "mousemove");
};
c._touchEnd = function(f)
{
    if (!a)
    {
        return;
    }
    d(f, "mouseup");
    d(f, "mouseout");
    if (!this._touchMoved)
    {
        d(f, "click");
    }
    a = false;
};
c._mouseInit = function()
{
    var f = this;
    f.element.bind("touchstart", b.proxy(f, "_touchStart")).bind("touchmove", b.proxy(f, "_touchMove")).bind("touchend", b.proxy(f, "_touchEnd"));
    e.call(f);
};
})(jQuery);

Kevin が書いたように、準備が必要な他の 2 つのページを ajax を使用してロードし、スワイプ トリガーを使用してアニメーション化してシャッフルすることができます。

于 2013-01-18T10:03:32.403 に答える
1

遅すぎるかどうかはわかりませんが、答えに答えるには、次のことを行う必要があります。

  1. 特定の div に ajax を介して各 html ページをロードします。jQuery $.ajax()はうまく機能します
  2. SwipeJSを使用すると、$.ajax がすべてをロードした後にスワイプ アニメーションを開始できます。

スワイプ機能を作り直す必要はまったくありません。SwipeJS は優れています。SwipeJS html 構造を使用していることを確認し、スワイプ可能な各 div にロードするだけです。それがそれに答えることを望みました。

于 2013-07-16T16:00:21.553 に答える