Lottie-web: How to delay lottie playback

Created on 28 Jul 2020  路  2Comments  路  Source: airbnb/lottie-web

I don't know much about this programming, so can someone help me? Now open the web page, it will automatically play the animation. I want it to play 5 seconds after I open the webpage, how should I modify this code:

var animation = bodymovin.loadAnimation({
  container: document.getElementById('glint'),
  renderer: 'svg',
  loop: false,
  autoplay: true,
  path: 'img/lottie/glint.json'
})

All 2 comments

setTimeout(() => {
  var animation = bodymovin.loadAnimation({
    container: document.getElementById('glint'),
    renderer: 'svg',
    loop: false,
    autoplay: true,
    path: 'img/lottie/glint.json'
  })
}, 5000)

I am not aware of delaying the animation programmatically but i have a workaround. you can keep an image placeholder for the lottie file(screenshot of lottie maybe) and replace it with lottie when you have to start the animation.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

hardy613 picture hardy613  路  4Comments

deborabm picture deborabm  路  3Comments

processprocess picture processprocess  路  3Comments

Sandok-voc picture Sandok-voc  路  4Comments

RenanSgorlom picture RenanSgorlom  路  3Comments