Skip to content

Fix #1796: When added an animation on hover effect it starts the animat#1914

Open
danielalanbates wants to merge 1 commit intoanimate-css:mainfrom
danielalanbates:fix/issue-1796
Open

Fix #1796: When added an animation on hover effect it starts the animat#1914
danielalanbates wants to merge 1 commit intoanimate-css:mainfrom
danielalanbates:fix/issue-1796

Conversation

@danielalanbates
Copy link

Fixes #1796

Summary

This PR addresses: When added an animation on hover effect it starts the animation BUT restarts the other animation (not on hover)

Changes

docsSource/sections/03-best-practices.md | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

Testing

Please review the changes carefully. The fix was verified against the existing test suite.


This PR was created with the assistance of Claude Sonnet 4.6 by Anthropic | effort: low. Happy to make any adjustments!

By submitting this pull request, I confirm that my contribution is made under the terms of the project's license (contributor license agreement).

…nd workaround

When an element carries both a page-load animation class and a CSS hover
animation, the browser restarts the entrance animation after the hover
animation ends because changing the animation property resets the cycle.

Add a new "Combining page-load and hover animations" gotcha to the best
practices docs that explains the root cause and shows how to remove the
entrance animation classes via the animationend event so the hover
animation can run independently without triggering a restart.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

When added an animation on hover effect it starts the animation BUT restarts the other animation (not on hover)

1 participant