From the course: Vanilla JavaScript: Animations

Unlock the full course today

Join today to access over 22,700 courses taught by industry experts or purchase this course individually.

Configuring our web elements

Configuring our web elements - JavaScript Tutorial

From the course: Vanilla JavaScript: Animations

Start my 1-month free trial

Configuring our web elements

“

- [Instructor] The new web animations API provides a common language for browsers and developers to describe animations and interact with playback using JavaScript in the most performant way possible. We'll now configure our project to make use of this API. Inside of our HTML document we don't need this canvas element any longer, so I'm going to delete that, and in its place, paste in a DIV with and ID of "web-animation". Go ahead and save the HTML file, and then pop over to the CSS file. We're not dealing with canvas anymore, so I'm gonna actually remove that definition, and in it's place we want to paste in some CSS rules for our web-animation ID. And there we are. So, what we're doing is setting the background color to black, setting the border to crimson solid at four pixels, and this is gonna look a lot like our canvas element did, except that the width is 200 pixels, and the height is 200 pixels, and it's given a margin of five rem. All right, go ahead and save the CSS file as…

Contents