Trigger Question - Setting Affected Elements

[TravisBKlein]

Hey guys, having little trouble selecting the proper element when setting “affected elements”

Currently it only allows me to select the top level class and I can’t narrow it down to get the proper element specifically.

Here is a screenshot of what I mean, that button I can’t select because the trigger only lets me just select “button” and not the rest.

[samliew (webflowexpert.com)]

Remove the classes one by one until you get to your required combination. It shows up after you have modified it once.

[TravisBKlein]

Hey @samliew , thanks for the reply, but I’m not sure I totally understand what you mean by remove classes.

I’m trying to add the classes and choose my exact button in the Trigger choose affected elements window, not take them away.

When I start by typing button which is the first class of my specific button I see the selector:

Ok cool so I can select “button” class, but my button is very different from that button, and the other classes it has were because of many changes I made to it, making it different from just the normal “button” class.

but when I type in the other classes my button has, nothing shows up for me to select this exact button:

[samliew (webflowexpert.com)]

Oh, I didn’t realise you were referring to the Interactions Panel. You only had a screenshot of the class selectors.

You are approaching this problem wrongly. The interaction TriggerClick is already added to the button, you shouldn’t need to select it again under “Affect different elements”, unless you want a different element to animate. The interaction will be attached to that particular element only (unlike classes), and you have to manually add it to other buttons if you want the same functionality.

[TravisBKlein]

@samliew

The interaction TriggerClick is already added to the button, you shouldn’t need to select it again under “Affect different elements”, unless you want a different element t

Sorry, I should have taken better screenshots and noted it better, my fault.

Yes yes exactly! I have selected an element already and now I want that element to cause this element to do something.

The interaction trigger is what I selected already (some other button I select with mouse, go into objects…) but I want to “AFFECT A DIFFERENT ELEMENT”, namely " [button] [hover letter spacing] [bottom] " element.

But I can’t select it, I don’t know how.

[samliew (webflowexpert.com)]

Simply either use “bottom” - the last class given to the element, or if that is used elsewhere, you have to give it a more specific fourth class that can be used in the interactions panel.

[TravisBKlein]

That did seem very easy and almost slapped myself in the face, but when I tried it, I still couldn’t get anything to come up under elements.

This is the affected element, I added “test1234” as the last class.

This is the element I select before going to objects:

this is what the box looks like when I type in “test1234”

There is no element to select so the “affect different elements” field cannot be filled.

this is a link to the page with the site link.
https://webflow.com/website/traviss-superb-site-2ee025

Thanks alot for the help @samliew , I’m really trying hard to understand what I’m doing wrong.

[Waldo (Waldo Broodrÿk)]

Hey @TravisBKlein at this time you can only target the main class per an element and cannot target the combo classes added onto an element. Instead you’ll need to create a new class for each element.

So in this case maybe add in each element and give them each a different class name instead of combo classes. Then you’ll be able to find those classes when you’re looking to affect other elements. Hope that clears things up for you!
I know it can be tedious but it’s worth it

[TravisBKlein]

@Waldo

y @TravisBKlein at this time you can only target the main class per an element and cannot target the combo classes added onto an element. Instead you’ll need to create a new class for each element.

AHH ok! that’s what I was doing, Like I’ll think and say oh maybe this can have a trigger affect after I’ve made it later on.

I’ll just rename them to one class like I was doing, but I bet they are going to upgrade this down the road
Thanks @Waldo!!

again

[Waldo (Waldo Broodrÿk)]

My pleasure to help @TravisBKlein Web design world can be a tricky place, and mastering interactions can take some time but they’re a lot fun to play with.

Just to make sure I was clear with my description, in your example, each of the four elements would need their own class.

So like:
Top Bar
Left Bar
Bottom Bar
Right Bar

Could be class names for each element, and then you’ll need to style each one appropriately and then you can call each one out individually with interactions. Sorry if there was any confusion! Feel free to reach out any time if you have any questions.