Streaming live at 10am (PST)

Swiper JS 6 Slider Carousel with pop-up

Hi @Siton_Systems !

I have already been using your swiper implementation and I loved it! Thank you so much for sharing!!

Now I have a different use case than last time and can’t find a solution:
I want each collection item to link to a pop-up.
This pop-up has to be placed within the collection item, as it contains content from the collection list. (at least that’s what I figured out)

If I use the swiper though the pop-up is kind of caged within the swiper container. It can’t expand to my full viewport hight and width.

Also the trigger doesn’t really seem to work. If I click on the collection item most of the time it would just slide in one direction or another instead of triggering the pop-up.

I already tried to use the webflow pagination for this and the pop-up worked perfectly. But with the custom code everything changes and as I am not a developer I can’t figure out what to do.

Here is the link to the site:

Original Post: How to integrate Swiper.js 6(Slider/Carousel - mobile touch) & Webflow CMS

Here is my site Read-Only: Webflow - EDDY

Here is a picture of the problem with the “caged” pop-up

And a picture of my layers structure

Thank you so much in advance!!

As I am trying to find a work-around atm I made some changes.
I am using the swiper only for the iPad and phone (without the pop-up) and I have set up webflow pagination for desktop.

I created a new page though for the swiper on desktop to provide you with a link: