waitForElementTransition () is a JavaScript library that provides a “Wait For Element Transition” function to delay triggering JS code until the CSS transition effect on an element has ceased.
You can use this library and call the wait For Element Transition method to wait for the element to finish moving css before doing other things in your JavaScript code.
Benefits:
- Easily wait for the css element to finish transition using JavaScript.
- It allows you to keep the css properties of the transition/animation separate from your JS.
- Native JavaScript without dependencies.
- More secure and reliable than shift and shift events.
- Nicely plays with the latest specifications.
How to make use of it:
1. Install the package with NPM.
# NPM $ npm i wait-for-element-transition --save
2. Import the waitForElementTransition element.
import waitForElementTransition from 'wait-for-element-transition';
3. Or from a CDN.
import waitForElementTransition from 'https://cdn.jsdelivr.net/npm/wait-for-element-transition/dist/wait-for-element-transition.js';
4. Apply the waitForElementTransition to the goal component which has a CSS transition impact.
waitForElementTransition(element).then(() => {
alert('The transition effect is ended.');
});Execute Codes Until An Element’s Transition Has Ended, waitForElementTransition() Plugin/Github, transition end, webkittransitionend, jquery transition end, ontransitionend, javascript on transition start, react on transition end
See Demo And Download
Official Website(markcellus): Click Here
This superior jQuery/javascript plugin is developed by markcellus. For extra Advanced Usages, please go to the official website.
