This course has been archived, the content is no longer up-to-date or relevant to most students.

This lesson is exclusive to members

Animate - HTML5 Banner Advertising in Adobe Animate.

Get the Animation to Stop Looping using JS and HTML5

Daniel Walter Scott || VIDEO: 41 of 53

Download Exercise Files

Contents

Introduction

Upon completing this tutorial, you'll be able to remove the default setting of Adobe Animate to loop over an animation, this was very highly requested and is a important thing to know when creating Banner Ads.

Comments

Video transcript

Hey there, in this video were going to look at how to stop an animation using some JavaScript. You'll notice if I preview, by default it really wants to loop for a bit. It goes back to the beginning and then loops back around. So what were going to do is we’re going to go through and add a bit of code just to make it stop.

So what you want to do is you want to have your play head along where you wan it to stop, I'm going to get mine to stop at the end, I'm going to click in any of these last frames, it doesn’t matter, its quite cool what used to happen is you used to have to create your own layer, call it actions create a key frame, all sorts of stuff so if you're old school flash, you don’t have to worry about that stuff anymore, all you need to do is have your timeline along here, I'm going to go to window, go to actions. He's hidden down here, and then I'm going to go code snippet, if its greyed out it means that you’ve clicked up here in the timeline but maybe not on any associated frame down here. So sometimes it’s greyed out.

Hit on code snippets, and in this code snippet you want the one that says html5 canvas, timeline navigation and this one here, stop at this frame. Double click, there's the code there and you can see down here its created a new layer for me called actions and its created a key frame for it and if I click off, you'll see the ‘a’, it means there's an action applied to it, its not action script, its JavaScript. And that’s what it is there. That’s the thing that will get it to stop, lets preview, plays once, and wobbly arm stops.

Alright, so that’s how to add an action and how to get your animation to stop using JavaScript.