Слайк шоу половина следующего слайда - PullRequest
0 голосов
/ 05 февраля 2020

Я пытаюсь создать слайдер, в котором первый слайд состоит из половины первого слайда и половины следующего, но когда пользователь нажимает предыдущий / следующий, слайдер должен показывать слайд полностью.

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

$(document).ready(function(){
  var boolRemove = 0;

  var slider = $('.slider').slick({
   'centerMode': false,
   'speed' : 300,
   infinite: false,
   cssTransition: true,
   draggable: false,
   initialSlide: 0,

  });

  $(".slick-list").addClass("half-slide");

  $(".slider").on("beforeChange", function(event, slick, currentSlide, nextSlide){


    if(!boolRemove) {
      $(slick.$slides.slice(2,slick.$slides.length)).hide();
        setTimeout(function(){
          $(slick.$slides.slice(2,slick.$slides.length)).show();
        }, 350);

      $(".slick-list").removeClass("half-slide");


      boolRemove = 1;
    }

    console.log( currentSlide );
  });

  $(".slick-arrow").on("click", function(){
    if ($(".slider").slick("slickCurrentSlide") == 0) {
       $(".slick-list").removeClass("half-slide");
    }
  });

});

Пример скрипта:

https://jsfiddle.net/brec38t0/1/

...