user-experience - 滑动并点击下一张幻灯片

Question

使用 flickity，是否可以在同一张幻灯片上同时具有两种行为？

• 刷卡（默认和更好的四个触摸屏）
• 单击到下一张幻灯片（更适合桌面）

我试过类似的东西：

var carouselCells = Array.from(document.querySelectorAll('.carousel-cell'))
  carouselCells.forEach(function(e) {
  e.addEventListener('click', function() {
    flckty.next();
  })
})

这是小提琴：https ://jsfiddle.net/francoisromain/fum7Lrac/

点击工作正常，但问题是滑动向前移动了两张幻灯片。

Answer 1

在标准点击上使用 Flickity 的 staticClick 事件，因为点击是在拖动过程中触发的。

flkty.on( 'staticClick', function() {
  flkty.next()
})

来自：https ://github.com/metafizzy/flickity/issues/486#issuecomment-258686221