javascript - Touchwipe集成-一页站点脚本

我一天中大部分时间都在进行故障排除，并在基于Parallax的自定义一页站点脚本（http://www.netcu.de/jquery-touchwipe-iphone-ipad-library）上搜索有关TouchWipe（http://www.joerg-niemann.de/blog/up-down-left-right-scrolling-single-page-website/）集成的问题的答案。为我的最新项目。

脚本本身可以完成我想要的一切，可以轻松实现漂亮的过渡效果和键盘控制，但是我无法一辈子，无法掌握如何集成TouchWipe。

这个想法是，访问iOS的用户应该能够像单击导航箭头或当前使用键盘一样轻松地用手指在页面之间进行擦拭/滑动/滑动。

我的问题是无法尝试为单击箭头或使用键盘调用与TouchWipe手势相同的功能。该脚本的单击函数调用部分如下所示：

        function setRight(page, text) {
            $("#rightText").text(text);
            $("#rightControl").show().unbind('click').click(function () {
                parallax[page].right();
            });
            rightKey = function () {
                parallax[page].right();
            };
        }

我绝不是JavaScript开发人员，而且由于我无法在任何地方找到关于如何将触控功能与此可爱的脚本集成的不错的答案（使用没有FAQ的自定义脚本令我感到羞耻），与您联系。

我尝试了多种不同的变体，这些变体在划像/划像/触摸上调用必要的功能，但是都没有起作用。我一生无法弄清楚为什么它不起作用：

<script>
    $(document).ready(function(){
        $('body').touchwipe({
            wipeLeft: function(){ parallax[page].left(); },
            wipeRight: function(){ parallax[page].right(); },
            wipeUp: function(){ parallax[page].top(); },
            wipeDown: function(){ parallax[page].bottom(); }
        })
    })
</script>

我希望我已表明自己的意思，否则请随时对我进行抨击，如果需要，我将提供更多信息。我敢肯定有一个简单的解释，说明为什么它无法按我的意愿运行，但我似乎无法弄清楚。

最佳答案

我终于想出了如何使用Parallax.js实现TouchWipe脚本。

这是将来以我本人的身份遇到问题的任何人的答案：

<script>
    $(document).ready(function(){
        $('#index').touchwipe({
            wipeLeft: function(){ $(".control").hide(); parallax.right.right(); },
            wipeRight: function(){ $(".control").hide(); parallax.left.left(); },
            wipeUp: function(){  $(".control").hide(); parallax.top.top();  },
            preventDefaultEvents: true
        });

        $('#right').touchwipe({
            wipeRight: function(){ $(".control").hide(); parallax.index.left(); },
            preventDefaultEvents: true
        })


        $('#left').touchwipe({
            wipeLeft: function(){ $(".control").hide(); parallax.index.right(); },
            preventDefaultEvents: true
        })

        $('#top').touchwipe({
            wipeDown: function(){ $(".control").hide(); parallax.index.bottom(); },
            preventDefaultEvents: true
        })

    });
</script>

原来，我不得不分别调用每个函数，为什么，我不知道，但是由于某种原因，它不接受在组合函数中调用两个函数。

因此，首先，调用这样隐藏控件的函数（以分号分隔，因此可以添加另一个函数）：

$(".control").hide();

然后，您必须像这样调用转换和页面更改（最后一个ID（parallax.xxxx.ID用于调用您希望新页面从哪一侧滑入-正如我使用TouchWipe将站点设置为一个web应用程序，我当然会从相反的位置将页面滑入：wipeUp触发parallax.top，wipeLeft触发parallax.right等）：

parallax.index.bottom();

这是新的，经过改进的kickass jsfiddle：
http://jsfiddle.net/Q96uH/2/

在我的堆高车上编码！