0

我想将滑动手势集成到整个网页。触发器将是整个包装器 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 所写，您可以使用 ajax 加载您需要准备好的另外两个页面，然后使用滑动触发器为它们设置动画以随机播放。

于 2013-01-18T10:03:32.403 回答
1

不确定我是否为时已晚，但要回答答案，您必须执行以下操作：

  1. 通过 ajax 将每个 html 页面加载到某些 div 中。jQuery $.ajax()做得很好
  2. 使用SwipeJS，您可以在 $.ajax 加载所有内容后启动滑动动画。

真的不需要重新制作滑动功能，SwipeJS 很棒。确保您使用 SwipeJS html 结构，并且只加载到每个可滑动的 div 中。希望回答它。

于 2013-07-16T16:00:21.553 回答