Execute Codes Until An Element’s Transition Has Ended – waitForElementTransition

Category: Javascript | July 14, 2020
Author:mkay581
Views Total:41 views
Official Page:Go to website
Last Update:July 14, 2020
License:MIT

Preview:

Execute Codes Until An Element’s Transition Has Ended – waitForElementTransition

Description:

A JavaScript library that provides a ‘Wait For Element Transition’ function to delay the excitation of your JavaScript codes until the CSS transition effect on an element has ended.

Similar to the transitionend event but more flexible.

How to use it:

1. Install the package with NPM.

# NPM
$ npm i wait-for-element-transition --save

2. Import the waitForElementTransition component.

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 target element which has a CSS transition effect. It returns a promise object where you can execute JavaScript codes after the transition ends.

waitForElementTransition(element).then(() => {
  alert('The transition effect is ended.');
});

You Might Be Interested In:


Leave a Reply