当 Flickity 到达下一张或上一张幻灯片时的事件

Event for when Flickity reaches the next or previous slide

本文关键字:一张 幻灯片 事件 Flickity      更新时间:2023-09-26

Flickity具有事件绑定。是否有将下一张或上一张幻灯片移动到时的事件?例如,在幻灯片沉降后触发结算事件。这确实满足了我需要的,但这里的问题是,如果 Flickity 在同一张幻灯片上稳定下来,它也会触发,如果您滑动但滑动不够并且 Flickity 会回到原来的位置,就会发生这种情况。cellSelect 演示似乎做了同样的事情。

在我看来,这样的事情也许可以解释我想要实现的目标:

$carousel.on( 'nextSlideReached', function() {
   console.log( 'Flickity has settled on the next slide' );
});

使用 settle 事件,我们可以检查是否已在新幻灯片上结算:

var selectedIndex = flkty.selectedIndex;
$carousel.on( 'settle', function() {
  if ( flkty.selectedIndex !== selectedIndex ) {
    console.log('settled at new cell', flkty.selectedIndex);
    selectedIndex = flkty.selectedIndex;
    // do stuff
  }
});