Introduced new swipeStart, swipeMove, swipeEnd event

[Arifursdev]

This pull request introduces new swipe-related events to the Slick slider, allowing developers to hook into the swipe lifecycle more easily. The changes include both documentation updates and event triggers in the code.

New Swipe Event Support

• Added new event triggers:
  • swipeStart – fired when a swipe begins
  • swipeMove – fired while the swipe is in progress
  • swipeEnd – fired when the swipe ends

Example Use Case

These new swipe events can help address common issues, such as preventing click events from firing while dragging a slide.

Scenario

Imagine a carousel section containing videos. Without proper swipe handling, after a swipe ends, if the mouse is over a video element, it may trigger a click and start playback unintentionally.

Implementation

$('[sample-section-wrap="items"]:not(.slick-initialized)').each(function () {
  $(this).slick({
    slidesToShow: 4,
    slidesToScroll: 1,
    swipeToSlide: true
    // ...
  })
  .on('afterChange', (event, slick, currentSlide) => {
    setTimeout(() => {
      $(this).removeClass('slick--is-moving');
    }, 100);
  })
  .on('swipeStart', () => {
    $(this).addClass('slick--is-moving');
  })
  .on('swipeEnd', () => {
    setTimeout(() => {
      $(this).removeClass('slick--is-moving');
    }, 100);
  });
});

.slick--is-moving {
  video {
    pointer-events: none;
  }
}

[markvantilburg]

@ahmadalfy can you merge this? (i cannot edit this pull to remove the .min.js)

[Arifursdev]

Fixes swipeMove event so it triggers when carousel actually moves