Hammer.js Carousel Start Pane

Question

Heyho，

我正在大学做一个项目，我想使用“Hammer.js”。 我已经下载了Carousel-Example，它对我来说非常适合。

但是我想开始我的代码的中间窗格，我认为这不是那么简单。

就像这样：

http://img203.imageshack.us/img203/6326/schemeas.jpg

所以Hammer.js始终以绿屏开始。但我喜欢从黄色开始。 我在init函数中添加了一次向右滑动，但是当页面加载时它看起来很糟糕而且不能成为目标^^

我希望你们中的任何一个人都知道如何解决我的问题。

Answer 1

尝试拨打

carousel.showPane(1);

这将立即显示第二个窗格。你会想把它放在靠近底部的地方，就在它说完之后。

carousel.init();

如果您有冒险精神，可以尝试自动启动该窗格，因为Carousel函数中有一个名为current_pane的变量，默认设置为0（第一个窗格）。改变这种方法也可能有效，但可能需要在其他地方使用更多代码。实验！

修改

NULL是正确的，它确实为它设置了动画。这是一个更深入的方法来设置它没有动画：

我发现负责更改哪个窗格的方法是setContainerOffset方法，可以传递一个变量来为它设置动画。我之前告诉过你使用showPane（2）然后调用

setContainerOffset(offset, true)

导致动画发生。你应该做的是制作一个稍微不同的showPane版本......

this.setPane = function( index ) {
         // between the bounds
        index = Math.max(0, Math.min(index, pane_count-1));
        current_pane = index;

        var offset = -((100/pane_count)*current_pane);
        setContainerOffset(offset, false);
    };

你会发现它几乎与showPane完全相同，除了名称以及它用动画调用setContainerOffset的事实：false。这将立即显示您选择的窗格，并可使用

进行调用

carousel.setPane(index);

我所做的是将它添加到init函数中，使它看起来像这样：

 this.init = function() {
        setPaneDimensions();
        var c = this;
        $(window).on("load resize orientationchange", function() {
            setPaneDimensions();
            c.setPane(current_pane);
            //updateOffset();
        })
    };

现在你可以改变

var current_pane = 0;

到你想要的任何东西，旋转木马将在初始化时始终以该窗格开始！简单！