JavaScript Webpage Workout - M1 Lesson 2 Exercise 2

This exercise follows exercise 1 of Lesson 2. Please do that lesson first for this exercise to make more sense. You can find the beginning of Lesson 2 here and the beginning of the course here.

Let’s try and make the DIV do a dance sequence by adding a button that triggers all the shapes to be made in a sequence.

• Add a button with an id of ‘all-btn’, a class of ‘btn’, and text content of ‘ALL’. When this button is clicked we should see all the shapes transition one-to-the-other in this order, one time through: ‘circle - oval - square - rectangle’
• Remember, you’ve already made functions for making each shape and so you can make use of them. Also, note that a function can call other functions.
• You’ll want to look into the window object method called setTimeout which can help you stagger the shapes so they play in a timed sequence.

You can compare your work with mine here at CodePen or watch the video.

M1 L2 Exercise 2 Solution

Keep practicing! Go on to exercise 3 of Lesson 2.