Alternate directions

Lesson 12 of 18 in Coddy's Moving Clouds - HTML/CSS/JS Project course.

Right now, our cloud is only moving to the right, which is cool but not enough. Now we will make him alternate between right and left!

Challenge

Easy

In the JavaScript file, add support in your interval for alternating directions.

What should happen?

In the first time the interval executes, the left style should be equal to 100%.

In the second time the interval executes, the left style should be equal to -50% (can be more or less you should test and see what works best).

In the third time the interval executes, the left style should be equal to 100%.

And so on...

Check the hints if you are not sure.

Try it yourself

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>

All lessons in Moving Clouds - HTML/CSS/JS Project

1Introduction

4Playing with JS

2Container

5Moving the Cloud

Alternate directions Project lesson

3The Cloud

6Many Clouds