Есть ли способ заставить слайдер Swiper двигаться с задержкой по вертикали?

Question

Я пытаюсь сделать слайд с помощью Swiper.js и пытаюсь добавить анимацию, когда нажимаю кнопку навигации. Поэтому, когда я нажимаю кнопку навигации, некоторая анимация применяется к текущему слайду, и после ее завершения я хочу перейти к следующему или предыдущему слайду. Я посмотрел Swiper API, но не смог найти там ответа, и поскольку слайд должен двигаться вертикально, кажется, что это все труднее реализовать. Есть ли способы заставить Swiper Slide работать так? Большое спасибо заранее.

Answer 1

Для перемещения ползунка по вертикали вы можете указать direction: "vertical" в параметрах swiper init.

var mySwiper = new Swiper ('.swiper-container', {
    // Optional parameters
    direction: 'vertical',
    loop: true,

    // If we need pagination
    pagination: {
      el: '.swiper-pagination',
    },

    // Navigation arrows
    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },

    // And if we need scrollbar
    scrollbar: {
      el: '.swiper-scrollbar',
    },
  })

Для создания пользовательских переходов может помочь ссылка ниже.

https://medium.com/@arnost/creating-custom-slide-transitions-in-swiper-js-also-with-gsap-ac71f9badf53