From the course: Vanilla JavaScript: Animations
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Ending an animation - JavaScript Tutorial
From the course: Vanilla JavaScript: Animations
Ending an animation
- Right now, if we leave our Javascript code as it is, the circle will continue to move and will eventually leave the visible viewport altogether. Let's place a limit on the amount of time our animation will run. All right, so we can do this within our circle animation function. Let's create an if statement. So if, and we'll also have an else in here. All right, so there's the basics of an if/else statement. So our content inside of the else curly braces is going to be what we have right here, the original content of this function. So I'm going to copy and paste that in there, using control or command x and v, for cut and paste. In terms of what we're going to be checking for, within the Javascript if statement, we want to stop the animation once it's been running for four seconds. So what we can do is compare the value of ol and see if it's greater than or equal to 4,000 milliseconds divided by 50. 4,000 milliseconds, of course, is four seconds. Now if that happens, what we want to…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.