Dropdown animation only works once smooth on first open then snaps open/closed after

[CameronF (Cameron Ford)]

---

Hey everyone,

I’m having an issue with a dropdown animation that I built in Webflow.

• It’s a native Webflow Dropdown (not a custom div).

• The dropdown list has a class like Dropdown List 5.

• I’m using Dropdown open/close interactions to animate its height and opacity.

• On the first open, it animates smoothly.

• On the second open, it just snaps open and closed — no smooth animation.

• I’ve already tried:

  • Rebuilding the animation from scratch

  • Resetting inline styles

  • Using class-based targeting (Only children with this class)

  • Even making a brand new dropdown in the same section

The strange thing is that one instance works perfectly, but copies of it or new ones made with the same animation don’t.

Is this a known issue with Webflow dropdowns or class-based IX targeting?
Could the built-in dropdown display:none behavior be overriding the animation after the first cycle?
What’s the best fix — keep using the native dropdown or rebuild as a custom dropdown using divs and IX only?

I would like if I don’t need to code out the animation for the drop down but I will admit I have yet to try that

Thanks in advance — any insight from someone who’s hit this before would be great.

Here is my public share link: LINK
(Webflow - Utah Home Builders home page)

[AJ_Dev (from Memberstack)]

Hey @CameronF ,

Can you make the following changes and test it out?

• Instead of targeting Dropdown List 5 element in the interactions, target the Dropdown element directly.

• If possible, have the same class for all dropdown elements instead of having it as PCHBA-Dropdown, ICHBA-Dropdown etc. I have set the class to all such elements as ‘Dropdown Element’ for example.

• In the Open Past Presidents interaction, select Dropdown Element for the first 2 actions and set Affect: Interaction trigger and set the height of the first action to 80px as shown in the screenshot below (You can set any height that fits your requirement, I am just taking this as an example).

• 

• In the Close Past Presidents interaction, select Dropdown Element for the first action, set Affect: Interaction trigger and set the height to 80px as shown in the screenshot below.

• 

After these changes, the dropdown opens and closes with a smooth effect every time and applies to all the dropdowns as well.

Here’s a guide on this as well, you can refer to it if you want to double-check while setting this up.

Hope this helps.