Motion Design with CSS

Motion Design with CSS Exercise 5: Sensing Visual Play Readiness

Topics:
Rachel Nabors
Rachel Nabors
Rachel Nabors, LLC

This course has been updated! We now recommend you take the CSS Animations and Transitions course.

Check out a free preview of the full Motion Design with CSS course:
The "Exercise 5: Sensing Visual Play Readiness" Lesson is part of the full, Motion Design with CSS course featured in this preview video. Here's what you'd learn in this lesson:

In this exercise, you will show and hide elements using a .loading class.

Get Unlimited Access Now

Transcript from the "Exercise 5: Sensing Visual Play Readiness" Lesson

[00:00:00]
>> [MUSIC]

[00:00:04]
>> Rachel Nabors: So here's a small exercise for sensing visual play readiness. When the browser has finished loading everything, we wanna change the class to remove the visibility of the spinner. So we're gonna show and hide the spinner using the loading class. There's some information in the actual exercise about what to do.

[00:00:23] I'm going to give you ten minutes to do it, and then we're going to do it together. And yes we're using jQuery, but if you don't want to use jQuery, because you object to jQuery, I respect your objection. You can totally go ahead and use JavaScript, plain old, good old JavaScript, if you like.

[00:00:41] But I'll be using jQuery. You're gonna listen for that load event.