Slick slider как сделать чтобы листал слайд при скроле?

Добрый день, подскажите пожалуйста как можно реализовать правильно, чтобы при скроле к блоку со слайдером он скролил ? Сейчас я отключил стрелки, но получается, что при скроле к блоку со слайдером останавливается, ты не можешь скролить вверх вниз, а включается скрол (стрелки) влево и вправо. Как сделать, чтобы не было остановки и слайдером скролился при скроле вниз и верх к блоку. Спасибо заранее.
jQuery(function($) {
      jQuery(document).ready(function () {
        $('.slick-slider')
          .slick({
            slidesToShow: 4,
            slidesToScroll: 1,
            autoplay: false,
            dots: true,
            arrows: false,
            infinite: false,
            responsive: [
              {
                breakpoint: 1400,
                settings: {
                  slidesToShow: 3.5,
                  slidesToScroll: 1,
                },
              },
              {
                breakpoint: 1200,
                settings: {
                  slidesToShow: 3,
                  slidesToScroll: 1,
                },
              },
              {
                breakpoint: 786,
                settings: {
                  slidesToShow: 2,
                  slidesToScroll: 1,
                },
              },
              {
                breakpoint: 600,
                settings: {
                  slidesToShow: 1,
                  slidesToScroll: 1,
                  variableWidth: true,
                },
              },
            ],
          })
          .on('wheel', function (e) {
            e.preventDefault();
            if (e.originalEvent.deltaY < 0) {
              $(this).slick('slickNext');
            } else {
              $(this).slick('slickPrev');
            }
          });
      });
    });
  • Вопрос задан
  • 257 просмотров
Решения вопроса 1
dedalik
@dedalik
Веб разработчик
Попробуйте так:
.on('wheel', function (e) {
    e.preventDefault();

    var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
    if(delta > 0) {
        $(this).slick('slickPrev');
    }
    else {
        $(this).slick('slickNext');
    }
    return false;
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
22 нояб. 2024, в 12:53
25000 руб./за проект
22 нояб. 2024, в 12:20
10000 руб./за проект
22 нояб. 2024, в 11:53
3000 руб./за проект