Streaming live at 10am (PST)

Modal slider with interactions not working


#1

I seem to run across two problems with my slider on the following site:
http://elsen-interieur-op-maat.webflow.io

You can preview the modal when you push “Totaal projecten”

It is build using the modal web flow tutorial, and added a slider to it. The first problem is that my images seem to run through the slides. Which screws up the whole lay out.

The second one is that the slider arrows doesn’t seem to work in the model. I’ve build this completely with interactions and no custom code. I’ve found some suggestions on this community but those involve adding code and I’m curious if there are other solutions given I don’t know that much code.

Thanks in advance!


#2

Please post your read-only link so we can view the issue.


#3

https://preview.webflow.com/preview/elsen-interieur-op-maat?preview=036813f72e54b1259c89e07386dc6a4a


#4

Okay it’s your “Modal Wrapper” and the “Slider” needs divs with images inside, then the Slider needs z-index 1001. Here I’ll do a quick video of your read-only and post here. Give me a minute…

Hey @Pauwelslies, How do you want the “Modal” to appear from being hidden?
Slide in from left, right?
Popup from 0% opacity?
Appear with no transition?

The “Popup” is the parent and it does need “HIDE/SHOW” for the arrows and buttons to work, because it’s set as “Fixed Full” to cover screen, so when you add only opacity, the browser still has it placed above all the content. You’ll think you can click it but nothing works (I tested this out a couple of times). The Popup needs to be removed from the DOM - or the browser document for any effects to happen - so using hide/show does remove it :grin:

Here ya go:


#5

Pop up from 0% opacity would be perfect, thanks!


#6

Wow thanks @garymichael1313 for the swift reply!

It’s working :tada:


#7

Whoo Hoo! Awesome. Glad to help! Holler if you need anything else.
Have Fun!


#8

This topic was automatically closed 125 days after the last reply. New replies are no longer allowed.