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

Add a transition event handler for CSS transitions #533

Closed
danielghost opened this issue May 8, 2024 · 1 comment · Fixed by #537
Closed

Add a transition event handler for CSS transitions #533

danielghost opened this issue May 8, 2024 · 1 comment · Fixed by #537
Assignees
Labels
enhancement New feature or request

Comments

@danielghost
Copy link
Contributor

Due to a limitation with how CSS transition events are handled, it isn't straight forward to identify when an element with a collection of differently configured transitions has ended. See cgkineo/adapt-list#85.

Adding functionality to core to listen to an element transition for either a named transition property, or to calculate the longest transition property, returning a Promise once finished or cancelled, will allow plugins to await as required.

@danielghost danielghost added the enhancement New feature or request label May 8, 2024
@danielghost danielghost self-assigned this May 8, 2024
@danielghost
Copy link
Contributor Author

danielghost commented May 8, 2024

From testing there are a few points that may not be immediately obvious when using transitions:

  • Once started, a transitions constituent properties cannot be adjusted, but they can be cancelled.
    • Changes to transition-duration mid-transition will be ignored and the previously set value will continue to be used.
    • Changing transition-property mid-transition will cancel the transition for any properties no longer included, while transition: none will cancel all transitions on that element.
    • If the value of an element property included in the transition is amended mid-transition (has to be a different value to before), that transition will be cancelled and a new instance will start. The new instance can now include an amended transition-duration (transitions for other properties not cancelled will continue to use the previous duration).
  • Transitions cannot be chained. Configuring multiple element properties must take place by using the correct comma separated config, whether via the shorthand method or for each constituent property individually.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant