How can svg(from bodymovin) work repeat without 'loop', when i use click function in jquery?

[ftorres99]

I made an animation svg file in after effect and exported it with bodymovin.

i copied and pasted in my editor the source in ‘demo.html’.

var params = {
    container: document.getElementById('lottie'),
    renderer: 'svg',
    loop: false,
    autoplay: true,
    animationData: animationData
};

var anim;

anim = lottie.loadAnimation(params);

i made loop true to false, because i do not need loop.
but when i click a icon(img file), i want to repeat only the animation svg file.

i tried this source

$('#icon').click(function(){
  $('#anSvg').reload();
});

but it does not work…
location.reload is not what i want …

[m3g4p0p]

Hi @ftorres99, you can replay the animation via the animation instance:

var animation = lottie.loadAnimation(params)

// Then, later:
animation.stop()
animation.play()
// Or:
animation.goToAndPlay(0)

[ftorres99]

Hi @m3g4p0p, unfortunatly it is still not working…
i tried them

animation.stop(false);
animation.play(true);
 
// or;

$('#icon').click(function(){
  $('#anSvg').animation.play(true);
});

Should i probably add one more script for the codes?,

[m3g4p0p]

Well it works for me… are there any errors in the console?

@ftorres99

animation.stop(false);
animation.play(true);

Neither of these methods take any arguments though, it’s just .stop() and .play(). Also in my above snippet I assigned the animation to an animation variable, whereas in your code it’s called anim – the name of the variable doesn’t matter, but you’ll have to adjust it either way.

@ftorres99

(‘#icon’).click(function(){ (’#anSvg’).animation.play(true);
});

That won’t work at all, you’ll have to call those methods on the animation instance as shown above.

BTW, please format your code snippets for better readability – you can do so by selecting it and clicking the </> icon.