Swiper with partial views of previous and next slides, Firefox issue

[pandora-otto]

So I wanted to create this set up, where you see one whole slide, and also you see on the left a portion of the previous slide, and on the right a portion of the next slide.

I've read we can use the parameter 'slidesPerView' and give it a float number for example 1.5 or 1.4.
Then use the 'centeredSlides' parameter to true.
This works great.

But we need to set the 'loop' parameter to true too.

So with these 3 params I get what I want.

const swiper = new Swiper('.swiper', {
	loop: true,
	slidesPerView: 1.4,
	centeredSlides: true,

	pagination: {
		el: ".swiper-pagination",
		clickable: true,
	},
});

Only thing is I found out it doesn't work nicely with Firefox browser. I've tested with Chrome, Edge, Safari and these work great.
With Firefox, you lose the slide animation when you use the pagination bullets. It sort of work sometimes after you used you mouse to swipe a slider. But I find the slide animation quite broken.

Has anyone else experienced this, and have fixed it?

I've put somewhere a demo for you to see.
https://pandoradesigns.co.uk/swiper/

Thank you

Firefox version 128.0
Swiper 11.1.5

[davidlawson001]

This is fantastic and highly informative! Thank you for sharing these valuable insights about automotive borescope camera manufacturers with us. Please continue to keep us updated. Much appreciated!