Streaming live at 10am (PST)

Webflow Interactions - Trigger on... makes element disappear


#1

Hi everyone!

I’m Kev, and I am new to this forum, pleased to meet you all. I have decided to create an account on the Webflow forum mainly because of the few bugs/problems I face from time to time; getting some help from the community (and giving back when I can) should fasten my design work, while maybe being able to help others!

Here is my first big problem: I have an interaction on 4 card-based designs. Right after the hero section, 4 cards with the headings “Preiswert, Sicher, etc…” appear. These four have “slide” interactions enabled.

I need these interactions to be gone for mobile (portrait and landscape). But, changing the “trigger on…” options makes the 4 cards completely disappear for phone landscape and portrait! Could this be a bug? The cards not only disappear when viewing on my phone, they disappear in the Webflow preview too.

The interactions are set for the elements with the class “content6-pic”:

And here my share-link: https://preview.webflow.com/preview/heyzahn?utm_source=heyzahn&preview=025d1bb95857f19d912bae0bc68e9c91

Either I am missing something, or this is quite the bug.

Thanks in advance!
Kev out.


#2

Hi Kevin! Welcome to the forums. It is a good idea to ask questions here, you will most likely get answers for all your questions. Eventually, haha

Ah yes, the infamous “initial state” problem. It was discussed numerous times before and the solution is to not use “initial state” for the interactions if you want to disable them on other layouts, since initial state will always be served even if the rest of the interaction is not going to start. The built-in interactions that happen on scroll (that you have used) use initial state so you cannot use them in your case I am afraid.

edit: to clarify, initial state in your case tells the element to “be hidden until you scroll into view, then fire the interaction” but since you have the interaction disabled on some layouts only this first “hide” part is executed not the actual “appearing” part.


#3

Thanks so much Dram, that answers my question. I tried searching for this problem before creating this thread, I have more than likely used the wrong keywords to search for it.

What a bummer, I guess I will keep the these animations for phones then. I knew these pre-made interactions were too easy and too good to be true lol! I will make sure to use “Start a new animation…” for anything else I do to avoid conflicts.

Thanks again!