Hi there, could someone teach me how to make this effect http://interactions.webflow.com example 2. To tell the truth, i don’t understand what i need to create firstly. With all interactions it is clear. But i don’t know which element should i create for this effect. A div block, or container. And where it will be located. Thanks for future feedback!
Interactions that are affecting other elements are pretty simple. They target an element by its class name, not its type. So it can be anything you want. A container, a div, anything. For the purple monkey example, let’s say a div.
Let’s do a step by step principle:
Build your page to the point you have the section that is going to trigg the interaction finished.
Now create a div, give it the class “monkeydiv”, build your monkey inside it, and position it exactly like you want to see it when its visibility is triggered by the interaction. In our example, it’s position:fixed, 0 to the bottom.
Now before starting with the interaction, select the monkeydiv and apply a transform on it, sliding it down until it disappears. let’s say 200px down.
Now select your section, the one who will trigg the monkey to appear. create an interaction on it, select the scrolling trigger, then type monkeydiv in the “Affect other element” box. It should appear, select it.
On the Scoll in, add Move and let it to zero (it means origin). On the scroll out, set it to 200px down.
That should work 
Hope it helps!
That how it works… Thanks a lot! Now i see making this is pretty simple)
Yep, now go put purple monkeys all over the web 
Have a nice weekend.
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.