javascript - 在鼠标单击时触发 Hammer.js 拖动/滑动行为

Question

我正在使用 Hammer.js 允许在窗格之间拖动。我还想允许一个替代操作，其中还有一个“下一步”按钮，您可以单击（用鼠标）或触摸（在触摸屏上），它会自动将幻灯片动画化到下一个屏幕。

想象一下Hammer.js Carousel 演示，页面中间有一个“下一步”按钮。当您单击时，它就像您进行了向左滑动一样将您带到下一个窗格。

我想我应该能够通过以下方式触发：

var hammertime = Hammer('button.next-button').on("tap", function(event) {
    self.next();        
});

这似乎只是让我的鼠标进入拖动模式，而不是执行整个动画。

Answer 1

我遇到了同样的问题。self.next() 显然不起作用，因为下一个函数未在 self 元素中定义。

您需要初始化一个新的轮播实例，然后调用 showPane(index) 方法：

      var hammertime = Hammer(doubletapRegion).on("tap", function (event) {
          console.log(event);
          var carousel = new Carousel("#carousel");
          carousel.init();
          carousel.showPane(1);
      });

此代码将移动第二个窗格（索引 = 1）。你当然可以在那里放一个变量。