Скользящий слайдер не всегда загружается с первого раза

Question

У меня есть активный сайт с 3 скользящими ползунками на одной странице, обычно пятно не инициализируется, и вместо этого я просто вижу все изображения, иногда, если я обновляю, все они начинают работать.

https://au.hairandme.com.au/collections/all/products/hair-rejuvenation-treatment

это рассматриваемая страница.

 ( function($) {
$.noConflict();
  $(document).ready(function() { 
  $('.HEROSLIDE').slick({
    autoplay: true,
  autoplaySpeed: 2000,
    pauseOnFocus: false,
  });

  $('.HEROSLIDEMOBILE').slick({
    autoplay: true,
  autoplaySpeed: 2000,
    pauseOnFocus: false,
  });
    $('.benefits-slider').slick({
  centerMode: true,
  centerPadding: '60px',
  slidesToShow: 3,
  responsive: [
    {
      breakpoint: 1024,
      settings: {
        arrows: true,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 3
      }
    },
    {
      breakpoint: 768,
      settings: {
        arrows: true,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 2
      }
    },
    {
      breakpoint: 480,
      settings: {
        arrows: true,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 1
      }
    }
  ]
});

$('.accordion').accordion({
defaultOpen: '',
cookieName: 'accordion_nav'
});
});
    } ) ( jQuery );

Answer 1

Для тех, кто все еще сталкивается с этой проблемой:

Я заметил, что для моих слайдеров эта проблема возникает только тогда, когда количество слайдов меньше или равно количеству слайдов в параметр в гладких настройках.

Так, например, если мои настройки:

      $('.article_gallery_slider').slick({
    infinite: true,
    slidesToShow: 3,
    slidesToScroll: 3
});

чем мне нужно иметь как минимум 4 слайда, чтобы они правильно отображались при первой загрузке страницы.

Для некоторых ползунков это на самом деле не имеет значения, и у меня не было времени выяснить, почему, но я надеюсь, что эта информация поможет вам с теми ползунками, которые работают неправильно.

Answer 2

В моем случае с 4 гладкими ползунками на одной странице проблема была такой же, и это конец 2019 года:), но я исправил ее, удалив свойство "adaptiveHeight", которое было у этого слайдера. Итак, согласно моей проблеме, возможно, вам также нужно проверить каждое свойство, прокомментировав его.