Slick Slider проблема "onclick" не работает после достижения точки останова - PullRequest
Новая
       11

Slick Slider проблема "onclick" не работает после достижения точки останова

0 голосов
/ 27 февраля 2019

У меня есть скользящий слайдер с функцией «onclick».Когда я нажимаю на текущий слайд, я должен добавить «активный» класс в контейнер изображений.Все работают нормально, но на скорости, когда разрешение достигает точки останова, не работают.

HTML-код 

<div class="my-gallery">
  <div class="my-gallery-image">
    <img src="">
  </div>
  <div class="my-gallery-image">
    <img src="">
  </div>
  <div class="my-gallery-image">
    <img src="">
  </div>
</div>

Slick Slider Code 

$('.my-gallery').slick({
    slidesToShow: 4,
    slidesToScroll: 1,
    dots: true,
    arrows: true
    responsive: [
      {
        breakpoint: 993,
        settings: {
          slidesToShow: 2,
        }
      },
      {
        breakpoint: 601,
        settings: {
          slidesToShow: 1,
        }
      }     
    ]      
});

Код сценария 

$('.my-gallery-image').on('click', function() {
    $(this).addClass('active');
});

На скользящем слайдере точки останова перезагрузите слайдер, и js не работают.

Как я могу решить эту проблему?

Спасибо!

Ответы [ 2 ]

0 голосов
/ 27 февраля 2019

Если вы хотите добавить «активный» класс к вашему тегу img, вам следует использовать функции jQuery find() или children(), чтобы получить его.

Это не зависит от точек остановаВы установили.

Проверьте этот пример 

$('.my-gallery-image').on('click', function() {
    $(this).children('img').addClass('active');
});

https://jsfiddle.net/ob0L1rth/1/

0 голосов
/ 27 февраля 2019

Я нашел решение.Необходимо установить контрольную точку управления 

$('.my-gallery').on('breakpoint', function() {
    $('.my-gallery-image').on('click', function() {
        $(this).addClass('active');
    });
});
...