â–Ľ
Streaming live at 10am (PST)

"Limit affected elements" on children of OTHER classes (not the trigger) possible?


#1

Hi guys,

first of all I want to apologize if this topic has been disussed/solved. I am in a huge hurry with my project and need help so I thought it would be best to simply ask you guys :slight_smile:

The issue:

I created a section with a very complex animation, triggered by a button within this section. All the animated elements are neither siblings nor children of the the button. The onclick-animation on the button works perfectly fine and triggers a huge amount of transitions on another div (and its children) withing this section.

So here comes the problem: I have to duplicate the entire section (including the button and all the stuff that gets animated). Since the animated elements are not related (no siblings/children) to the trigger (the button) I am not able to limit the animation to the children of the section that contains the trigger. Therefore, all instances of the classes within all sections on the entire page get animated simultaniuosly - obviously not the behaviour I wanted to achieve.

“Limit affected elements” under “Replace elements in animation” is only available for children or siblings of the trigger if I understood correctly. Is there any solution to this problem?

Any help is very much appreciated.

Thanks in advance,
Daniel


#2

Changing the structure to move or change the trigger element, so that it’s either the sibling or the parent or the targeted object. It’s a “design” solution. in most of the case it’s possible.

If you mind sharing your public link we can look at the structure and try to find a way.


#3

hi Vincent,

thanks a lot for your fast help! Actually your answer told me everything I need to know.

I already tried your approach to restructure the page entirely but unfortunately this isn’t possible due to the complexity (and amount) of the animated objects. The trigger object is a vital part of another group of objects that dynamically translates/resizes its parent based on the content of its siblings. The objects that need to be animated are actually filling the whole viewport and consist of various subsections …

Due to this I think it’s actually faster/easier to rebuild the entire website from scratch the good old fashioned way without webflow :confused:

Unfortunately I am not allowed to share a public link without my clients permission :frowning:

Nevertheless, big thanks for your fast answer :facepunch:


#4

This is now possible. Thanks for your patience!! https://webflow.com/feature/reusing-interactions-just-got-way-easier