Slide slider when scrolling with mouse

[ruslankush]

Hi I use SLICK SLIDE I had problems scrolling with the mouse on the Mac IOS slides scrolled not one slide at a time but several at once. How can I fix this?

http://jsfiddle.net/rasell/fmo50w7n/5655/

[cr0ybot]

I am using wheel-indicator to solve this problem. This is not an issue with slick slider, it is an issue with native Mac inertial scrolling.

Example:

var wheel, scrolling;
var $carousel = $('#carousel');
$carousel.on('init', () => {
    wheel = new WheelIndicator({
        elem: $carousel[0],
        callback: wheelHandler,
    });
})
.on('beforeChange', () => {
    scrolling = true;
})
.on('afterChange', () => {
    scrolling = false;
})
.slick({
    /// options...
);
function wheelHandler(e) {
    if (!scrolling) {
        console.log('Mouse wheel scroll:', e.direction);
        $carousel.slick(e.direction === 'up' ? 'slickPrev' : 'slickNext');
    }
}

[virajkadam]

I am using wheel-indicator to solve this problem. This is not an issue with slick slider, it is an issue with native Mac inertial scrolling.

Example:

var wheel, scrolling;
var $carousel = $('#carousel');
$carousel.on('init', () => {
  wheel = new WheelIndicator({
      elem: $carousel[0],
      callback: wheelHandler,
  });
})
.on('beforeChange', () => {
  scrolling = true;
})
.on('afterChange', () => {
  scrolling = false;
})
.slick({
  /// options...
);
function wheelHandler(e) {
  if (!scrolling) {
      console.log('Mouse wheel scroll:', e.direction);
      $carousel.slick(e.direction === 'up' ? 'slickPrev' : 'slickNext');
  }
}

Thank You ! Thank You !! Thank You !!!

[krzwt]

var wheel, scrolling;
var $carousel = $('#carousel');
$carousel.on('init', () => {
    wheel = new WheelIndicator({
        elem: $carousel[0],
        callback: wheelHandler,
    });
})
.on('beforeChange', () => {
    scrolling = true;
})
.on('afterChange', () => {
    scrolling = false;
})
.slick({
    /// options...
)};
function wheelHandler(e) {
    if (!scrolling) {
        console.log('Mouse wheel scroll:', e.direction);
        $carousel.slick(e.direction === 'up' ? 'slickPrev' : 'slickNext');
    }
}

It's Working fine Thanks

[szaj]

Hello Guys. I finally found some help on this. I am stuck in the same problem. The code is working fine but on mac trackpad it is scrolling several at once and I don't know how to put the above solution in this code. Can you guys help me out please. This is the web url : https://mendhro.com/product/mens-faux-motorcycle-soa-tv-series-biker

``