CSS Tricks

JavaScript makes it possible to manipulate CSS styles dynamically.

Background Colors

Click here to view the Repl project. Fork the project to begin.

Testing

Run the project and test out the site to see how it works.

Updates

There are a few things you can try to change. Open up the script.js file to try to figure it out:

• Make the gradient colors update faster or slower
• Make one of the buttons set the background to magenta
• Make the gradient colors change more drastically each animation tick

Fading Pictures

Click here to view the Repl project. Fork the project to begin.

Testing

Run the project and test out the site to see how it works.

Updates

There are a few things you can try to change. Open up the script.js file to try to figure it out:

• Make the picture fade in and out faster or slower
• MINI-CHALLENGE: Make the second picture more visible when it is shown
• MINI-CHALLENGE: Change the image