Search code examples
javascriptbodymovin

How Do I Delay a Bodymovin Animation

Ok so I just started using bodymovin and was wondering if there was a way for me to delay the animation.

My web page fades in so during that fade in the animation is happening which is not what i would like. So if I could delay it by 2 seconds that would be great.

Here is my code:

var animation = bodymovin.loadAnimation({
container: document.getElementById('bm'),
renderer: 'svg',
loop: false,
autoplay: true,
path: 'data.json'

})

I have tried to use setTimeout but I have not been able to get it to work.

Solution

  • You could set the autoplay value to false, and call play() in a timeout of 2000ms. I'm assuming you're using the library found here.

    var animation = bodymovin.loadAnimation({
  container: document.getElementById('bm'),
  renderer: 'svg',
  loop: false,
  autoplay: false,
  path: 'data.json'
})

setTimeout(function(){ animation.play(); }, 2000);