如何实现Slick Slider拖拽松开后可停在任意位置

Slick 默认的滑动逻辑是拖拽结束后根据滑动距离判定是否切换幻灯片，要实现拖拽松开后滑块停在当前位置、不自动吸附到完整幻灯片位置的效果，直接修改初始化配置即可：

基础配置方案 #

90%以上的场景直接调整初始化参数就能满足需求，核心是把滑动触发阈值拉到极大值，让Slick永远不会触发自动切换上下张的逻辑：

$('.your-slider-element').slick({
  // 此处保留你原有配置的其他参数，比如slidesToShow、自适应相关配置等
  draggable: true,
  swipe: true,
  // 核心修改参数
  touchThreshold: 9999,
  waitForAnimate: false,
  // 不需要无限滚动的话建议关闭，避免边界位置异常
  infinite: false,
});

精细控制方案 #

如果基础配置无法完全匹配你的需求，需要完全接管拖拽结束后的逻辑，可以额外绑定事件终止Slick默认的吸附动画，锁定当前偏移位置：

// 监听鼠标/触摸松开事件
$('.your-slider-element').on('mouseup touchend', function(e) {
  const sliderInstance = $(this).slick('getSlick');
  // 终止当前运行的动画
  sliderInstance.$list.stop();
  // 标记动画结束，阻止Slick自动触发后续吸附逻辑
  sliderInstance.animating = false;
  e.stopImmediatePropagation();
});

注意事项：

• 如果需要保留infinite: true无限滚动模式，需要额外添加逻辑限制拖拽的最大/最小偏移量，避免拖拽到空白区域
• 以上方案兼容slick-carousel 1.7+ 所有正式版本

内容的提问来源于stack exchange，提问作者Tafseer Hussain