List plugin



You can install Movigo list plugin with NPM:

npm install @movigo/list --save


You can also load it with CDNs:

  <script src=""></script> <!-- Required dependency -->
  <script src=""></script>


List plugin function creates an animation for lists of elements with slide-in and fadein effects. In particular, it create an animation for each element of the list using the same keyframe and adequately defining transform and opacity CSS properties, and start each element with a delay defined according to the duration of the animation (1/3 of the duration).

It is possible to define the initial coordinates, the duration and the easing function for each element. Default coordinates and duration are defined assuming a large transition area, while the default easing function simulates a fast start and a constant decelaration of the elements.

  const elements = document.querySelectorAll('li')

    x: 200, // Initial relative x coordinate (default: 0)
    y: 200, // Initial relative y coordinate (default: 100)
    duration: .5, // Animation duration (default: .3)
    easing: 'linear' // Easing function (default: 'cubic-bezier(0.0, 0.0, 0.2, 1)')