Coverflow swiper effect - arrows & slides per view

I’ve implemented code to try and achieve my initial carousel style product section. It’s going pretty well but I have two issues. Please see screenshot attached to see what I’m aiming for…

FIRST I have 5 products in total on a loop, but only want to be able to see 3 at a time without the others being cut off at the sides. It’s meant to look like they’re coming in from the shadows. (Like my screenshot). I’ve played around with ‘slides per view’ and ‘loop’ but can’t seem to figure it out.

SECOND I have added some arrows because I’d like to be able to click through the options as well as drag, but can’t figure out how to make them work for that purpose. Right now they’re just link blocks that don’t do anything.

I am new to Webflow and coding so you might have to spell it out for me!


Here is my site Read-Only: https://preview.webflow.com/preview/onyx-c5d849?utm_medium=preview_link&utm_source=designer&utm_content=onyx-c5d849&preview=e8fe77512a8dd69d6a144975042b007b&mode=preview
Published site: https://onyx-c5d849.webflow.io

Hi @megan0 I made this test for you to clone, it really straight forward.

https://webflow.com/website/Custom-animation-slider?s=rotatingslider

Mind the custom code in the settings, and also the IDs.

Let me know if it helps!

Cool thanks so much!

How would I edit only the slide in the middle that’s in focus? I want to make it bigger than the others and sitting in front like my screenshot.