Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Keyframes don't replay when variant label changes #1346

Closed
ShahriarKh opened this issue Nov 9, 2021 · 0 comments · Fixed by #1355
Closed

Keyframes don't replay when variant label changes #1346

ShahriarKh opened this issue Nov 9, 2021 · 0 comments · Fixed by #1355
Labels
bug Something isn't working

Comments

@ShahriarKh
Copy link

ShahriarKh commented Nov 9, 2021

Using the same keyframes sequence for opacity in different variants only animates on the first render. Also, the opacity stays at the last value in the next renders.

https://codesandbox.io/s/angry-raman-bc9sf?file=/src/App.js

Steps to reproduce the behavior:

  1. Go to codesandbox link above.
  2. Click on "X" Button to toggle state (& fire animation)
  3. See problem

Expected behavior
The box should go from opacity: 0 to opacity: 1 on every click.

Changing the other keyframe to another value with a little difference works correctly:
[0, 1] for both variants => animaties on initial render and stays on 1
[0, 1] for one and [0, 1.01] for another => works correctly

Question on Stackoverflow:
https://stackoverflow.com/questions/69887735/framer-motion-opacity-keyframe-only-animates-on-initial-render

@ShahriarKh ShahriarKh added the bug Something isn't working label Nov 9, 2021
@mattgperry mattgperry changed the title Opacity keyframe only animates on initial render Keyframes don't replay when variant label changes Nov 17, 2021
@mergetron mergetron bot closed this as completed in #1355 Nov 19, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant