Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

LinkedIn Learning

Vanilla JavaScript: Animations

via LinkedIn Learning

Go to class Write review
CourseHorse Ad

Give the Gift That Unlocks Potential

Learn More → Scrimba Ad

Our career paths help you become job ready faster

Learn More →

Overview

Coursera Flash Sale
40% Off Coursera Plus for 3 Months!
Grab it
Animate content with JavaScript and native web technologies. Explore how to configure and animate DOM elements, animate within the HTML5 canvas, and use the Web Animations API.

Syllabus

Introduction
  • Welcome
  • What you should know
  • Using exercise files
1. Web Development Fundamentals
  • Alternative options for animation
  • Choosing a development environment
  • Creating an HTML document
  • Styling the document with CSS
  • Writing JavaScript
  • Testing in the browser
2. JavaScript Animation Foundations
  • Configuring DOM elements
  • Visual change over time
  • Ending an animation
  • Making use of requestAnimationFrame
  • Interactive animation
  • ✓ Challenge: Additional properties
  • ✓ Solution: Additional properties
3. Animating within Canvas
  • Configuring a canvas element
  • Drawing within the canvas context
  • Animating within the canvas
  • Adding acceleration
  • ✓ Challenge: Adding effects
  • ✓ Solution: Adding effects
4. Web Animations API
  • Configuring our web elements
  • Basics of the animate method
  • Using additional keyframe properties
  • Apply easing to the animation
  • Controlling animation playback
Conclusion
  • Goodbye

Taught by

Joseph Labrecque

Reviews

4.5 rating at LinkedIn Learning based on 50 ratings

Start your review of Vanilla JavaScript: Animations

Go to class

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.