在 flickity 中停止 freeScroll - Javascript

当使用 Flickity 创建一个轮播图时，默认情况下会启用 freeScroll 选项，它允许用户以任意速度滚动轮播图。但有时我们需要禁用此选项并使其只能在某些位置停止滚动。在本文中，我们将学习如何在 Flickity 中停止 freeScroll。

方法

要停止 freeScroll，我们需要在 Flickity 的选项中将其设置为 false。然后使用该选项对象调用 flickity.reloadCells() 方法，以重新加载单元格并重新初始化赛道。

// 初始化 Flickity
var flkty = new Flickity( '.carousel', {
  freeScroll: true
});

// 在某些条件下停止freeScroll
flkty.options.freeScroll = false;
flkty.reloadCells();

reloadCells 方法将重新创建布局和单元格。 这是因为当 freeScroll 选项为 true 时，Flickity 的单元格高度将设置为窗口高度。

结论

使用上述代码，您可以在 Flickity 中轻松停止 freeScroll。 这使得用户无法无限制地滚动，而只能停止在在某些位置。