JavaScript Webpage Workout - M1 Lesson 2 Exercise 3

This exercise follows exercise 2 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 to add some text in the shape. Right in the middle! Then let’s make it “dance” continuously until we click the DIV to make it stop.

• Add the shape’s name as textContent in the center of the myShape DIV when each shape’s button is clicked. For example, click the ‘CIRCLE’ button and the myShape DIV shows ‘CIRCLE’ in the DIV.
• Position the text in the center of the myShape DIV.

Extending the exercise

• Add functionality to have the shape sequence play in a loop until a new button (or the document or myShape DIV) is clicked, to stop the shape sequence.
• If you’re stuck, you can look into the window object’s method called setInterval

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

M1 L2 Exercise 3 Solution

Practice makes perfect! Go to Lesson 3.