使用 Slick（jQuery 插件） slickGoTo 不起作用

Question

我遇到了这个名为的 jQuery 插件的问题 Slick 第一次加载时它不能正常工作 screenshot 在我点击下一个或上一个后它就位 screenshot_1 我试图让幻灯片像这样移动 HTML

<div class="modal" id="subscribePopup">
        <div class="subscriptionOffers">
          <div style="text-align: center; font-weight: 900;"><h6 style="font-weight: 900;">One month reecurring payment</h6>
            <p><h1>$30</h1></p>
            <p>/monthly</p>
          </div>
          <div style="text-align: center; font-weight: 900;"><h6 style="font-weight: 900;">Three months reecurring payment</h6>
            <p><h1>$15</h1></p>
            <p>/monthly</p>
          </div>
          <div style="text-align: center; font-weight: 900;"><h6 style="font-weight: 900;">Six months reecurring payment</h6>
            <p><h1>$10</h1></p>
            <p>/monthly</p>
          </div>
          <div style="text-align: center; font-weight: 900;"><h6 style="font-weight: 900;">Anually reecurring payment</h6>
            <p><h1>$5</h1></p>
            <p>/monthly</p>
          </div>
        </div>
  </div>

jQuery

 $(document).ready(function(){
      var slider = $('.subscriptionOffers').slick({
      infinite: true,
      arrows: true,
      centerMode: true,
      centerPadding: '15%',
      initialSlide: 0,
      speed: 300,
      prevArrow:'<div class="prev"><img src="img/prev.png"></div>',
      nextArrow:'<div class="next"><img src="img/next.png"></div>'
      });
});
    $(window).load(function(){
      slider.slick('slickGoTo',2);
      slider.slick('slickGoTo',1);
    });

在窗口加载但它不起作用：/

Answer 1

尝试以下操作：

 var $slick;

 $(document).ready(function(){
    $slick = $('.myDiv');

    $slick.slick({
        infinite: true,
        arrows: true,
        centerMode: true,
        centerPadding: '15%',
        initialSlide: 0,
        speed: 300,
        prevArrow:'<div class="prev"><img src="img/prev.png"></div>',
        nextArrow:'<div class="next"><img src="img/next.png"></div>'
    });

    $slick.slick('slickGoTo', 1);
});   

Working pen