Trouble reusing a class's interactions across tabs element

Design help Animations & Interactions
1

Hi there!

There is a hover interaction that I’m incorporating for an element I’ve called “external resources link block” on the “resources” page of this site. It’s relatively simple — when the user hovers over the link block, I’d like the arrow to rotate -45 degrees.

I’ve successfully set up the hover animation on the “buyers” tab. However, this interaction doesn’t work when the user clicks into different tabs, even though the element shows that an interaction is being applied.

I’ve also created a short video to demonstrate the problem that I’m running into. You can view it on Loom here.

What am I missing here? Thanks in advance for the help!

Anthony

2

Hello.
Nice video, but please share a link. Makes it a lot easier to help.

3

Hey @HGWeb!

The read-only link to the project is hyperlinked above :slight_smile: Try clicking on “this site” in my original post. Thanks!

4

Apply the hover animation to the class “arrow”. Inside the animation, change the option affect from selected element to interaction trigger. I just tried and it works.

5

Fantastic, that worked perfectly! Appreciate your help, @Luca.