From the course: Learning JavaScript Debugging

Unlock the full course today

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

Solution: Putting it all together

Solution: Putting it all together - JavaScript Tutorial

From the course: Learning JavaScript Debugging

Start my 1-month free trial

Solution: Putting it all together

“

(upbeat music) - [Narrator] Okay, let's take a look at a solution to this challenge. We're trying to solve three issues. Let's take them one by one. First, we'll deal with the timing of the closing of the modal. So if I refresh this page to make it appear again, here it goes and close and it disappears super fast. So let's open the developer tools and here in the sources pane I'm going to open my challenge.JS file and my challenge.CSS file. In these styles, I can see that we have a transition set for the modal container, that's the overlay where its opacity changes over the course of one second, and then the inner portion with the actual form changes over two seconds. And we have a couple of classes here that will toggle the opacity. And we also have this display block, which defaults to none, so the overlay doesn't block anything on the page. All right, what we're dealing with is how the modal closes. So I'm going…

Contents