Как сделать такой слайдер (в виде стопки) на Swiper?

Question

[Александр Осадчий]

Здравствуйте!

Подскажите пожалуйста, как сделать такой слайдер (чтоб немного были видны следующие фотки + дублтрующиеся огромные стрелки..

Answer 1

[RAX7]

Comments

[Александр Осадчий]

Спасибо вам большое!

[RAX7]

Александр Осадчий, пожалуйста =)

[Антон Литвиненко]

RAX7, сори, что лезу, а как сделать такой слайдер как в задании, чтобы стопка слайдов только с одной стороны торчал?

[RAX7]

Антон Литвиненко, просто убрать loop: true

[Антон Литвиненко]

RAX7, когда начинаешь листать, все равно слева начинает тоже стопка собираться

[RAX7]

Антон Литвиненко, можно так сделать

.swiper-wrapper {
    margin-left: -25%;
}

[Антон Литвиненко]

RAX7, гениально

[Александр Осадчий]

RAX7, А я вот какую штуку заметил - этот слайдер в браузере Firefox очень сильно дергается...особенно на мобильных устройствах...и это жесть какая проблема((

[RAX7]

Александр Осадчий, у меня только в мобильном фф такой баг, не знаю с чем это связано, но помогает отключение transition для слайдера

const isFirefoxAndroid = /Android.+Firefox\//.test(navigator.userAgent);
new Swiper(".swiper-container", {
  speed: isFirefoxAndroid ? 0 : 300, // turnoff transitions for Firefox
  }
)

[Александр Осадчий]

RAX7, Это круто...спасибо

Бред с эти FF получается((

А можно еще как-то с десктопным FF повоевать?

[RAX7]

Александр Осадчий, я не знаю в какую сторону воевать, у меня на десктопе всё норм
https://gofile.io/d/qVfBQB

[Александр Осадчий]

RAX7, Вот - десктопный firefox - вот вообще везде все хорошо...даже IE..но не тут
https://gofile.io/d/H3D0Yh

[RAX7]

Александр Осадчий, странненько, похоже на тот же баг с transition, что и в мобильном. Остальные демки свайпера нормально работают? https://swiperjs.com/demos/

[Александр Осадчий]

RAX7, Да, все до единого - работают нормально(

[RAX7]

Александр Осадчий, можно выключить переходы между слайдами для фф (так же как и на мобильном), как пофиксить эту бяку я не знаю ¯\_(ツ)_/¯

[Александр Осадчий]

RAX7, а как можно отключить одновременно и для мобайл (ваш вариант выше) и для десктоп?

[RAX7]

Александр Осадчий,

const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
new Swiper(".swiper-container", {
  speed: isFirefox ? 0 : 300, // turnoff transitions for Firefox
  }
)