<div id='animationDiv' style="background-color: yellow;width: 500px">

  Fade IN

</div>

<button  onclick="startAnimateDiv()">

  start animation

</button>

​

<button onclick="stopAnimateDiv()">

  stop animation

</button>

​

const element = document.getElementById('animationDiv');

​

function startAnimateDiv() {

  const animationInstance = mdb.Animate.getOrCreateInstance(element, {

                animation: 'fade-in',

                animationStart: 'manually',

                animationReset: true

            });

  animationInstance.init();

  animationInstance.startAnimation();

}

​

function stopAnimateDiv() {

  const animationInstance = mdb.Animate.getOrCreateInstance(element, {

                animation: 'fade-in',

                animationStart: 'manually',

                animationReset: true

            });

  animationInstance.startAnimation();

}

​