Forum Academy Marketplace Showcase Pricing Features

How can i sync the animation of a dropdown field and a text field?


I am having the following problem.
When I animate a dropdown list and a text, the dropdown field always “lags”. No matter how much data is has to “render” (simple yes/no for example).

Here is a gif to show you what i mean (the fps are low, so it wont seem really “smooth”)

I tried a waiting worflow in order for it to “load” properly, but that doesnt seem to do the trick. The dropdown field just “lags” which means that it’s a splitsecond slower with it’s anmation which kind of ruins the “smoothness”. Any idea how to fix it?

Thanks in advance!

Why don’t you put both inside a group and animate the group?

1 Like

Thanks! I tried that but the group is not showing up at all if i animate it. Am i doing something wrong?

The page just stays blank, like this.

Does it have to do anything with it being in another group (a group in a group)?

Your group is configured to be invisible on the page load.
Check this box to make sure you will see it when page loads…


Could you also give us more details about your workflow? In your image we can see just a little bit of it. What animation are you using? The name is also cuted…


1 Like

//EDIT: Oh okay you were right, I didn’t think it through.

The group itself shouldn’t be visible on page load, but the elements inside it should be. My bad. I will see if it works better now with the animations

Hey, thanks!

It should be invisible, that’s correct. Take a look at the gif on my first post. This wouldn’t work if its visibile from the beginning.

The text should be sliding in from the site, after it has been triggered.

Workflow is basically:

User enters Information A → input and text field slides out → new fields slide in → User enters Information B → input and text field slides out → new fields slide in and so on.

The animations i am using are: Transition NoBounceRightIn and Transition NoBounceLeftOut

As you can see i am currently doing it by animating the text field AND the input field separately because animating the group doesnt work for me. But if i group two items, like a text field and an input field, and try to animate them → it doesnt work.

Did you manage to solve it?
You marked my post as a solution but it seems that you still have issues…

Here is a video showing the result I get…

Hey, your post was the solution. Everything after that was just my personal mistakes! :slight_smile:
Thank you!

1 Like


1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.