Skip to main content
Known Participant
October 27, 2019
Answered

How to Stop an HTML5 animation after three loops?

  • October 27, 2019
  • 4 replies
  • 6407 views

Hi, I'm relatively new to Animate for HTML5 Banner ad production. 

I have a 10 second timeline. My limit for my final banner ad is 30 seconds then it needs to freeze. So, three loops. I've watched a number of tutorials but none seem to cover this that I've found.

 

Is there a good way to control an animation so it doesnt exceed the allotted looping requirement?

 

Thanks!

This topic is closed to new replies. Start a new post to keep the conversation going.
Correct answer marjantrajkovski

Put this code at the end of 10 second timeline

 

if (!this.looped) this.looped = 1;

if (this.looped++ == 3) this.stop();

4 replies

marjantrajkovskiCorrect answer
Inspiring
October 27, 2019

Put this code at the end of 10 second timeline

 

if (!this.looped) this.looped = 1;

if (this.looped++ == 3) this.stop();

Known Participant
October 27, 2019

@marjantrajkovski, CBLIVI,

Thank you so much.

 

The code at the end of the timeline above worked perfectly. Thank you!

Participant
January 20, 2022

Hi, where in the timeline do I add that and in what form? In the actions layer? I thought actions didn't work well in HTML5? I'm trying to make a banner ad loop 3 times only as a media company are saying it needs to play no longer than 30 seconds (the ad is 7 seconds long). 

Inspiring
October 27, 2019

There was a fairly similar thread recently about looping an HTML5 animation a fixed number of times.  I'd suggest you have a look at that and look at the example files provided by the Adobe Community Expert who responded (resdesign): https://community.adobe.com/t5/Animate/At-a-loss-How-do-I-get-my-animation-to-loop-a-set-number-of/m-p/10674885

 

In essence, you need to set a counter in code for the number of required loops then do an if/else statement to check if another loop needs to run (or else stop).