I’m trying to setup a website with slider interactions so various sections are clickable and will slide across when clicked on and push out the other sections. In Webflow, it appears that if you have something that slides (as an animation) it won’t automatically push other elements of the website around as it moves, even if they are in a flexbox together.
So, I tried to fix this by animating all the sections, so if I have one section that slides across then I made another animation on the section next to it that also slides across so it looks as though each section is reacting to the other.
Problem is it’s really quite buggy (as you can see in my shared link). It’s also not ideal as I wanted sections to be able to expand (or slide) from where they end up on the page so when I slide something over from the left and it goes to the right, if I slide it over again it’ll come from the left although the actual element I’ve clicked is on the right.
If you look at the share link, the blue and red sections should always be clickable and will shrink onto the right when you open up a link from the menu on the left. They will always be clickable, even in their smaller state.
It’s kind of complicated but hopefully someone can figure out what I mean and offer some sort of guidance! It’s driving me crazy!
Thank you, share link below.
Here is my site Read-Only: https://preview.webflow.com/preview/tailor-inc?preview=15b4551a2179357a69bbb4b10d9419d4