My Coding Story

By: Sophie Myers

What's this project about?

I love taking walks to get energy out and also for relaxation. Here are some pictures of me on my walks!!
The other thing I love is the sky. Whenever there is a cool sunset or sunrise, I'm probably going to take a picture of it. Here are a couple of examples from places all over!

My question was:

How do I incorporate and combine these two things, along with other aspects into a singular project?

I combined a couple of my favorite things into 1 display of all of them:

Pictures I took of sunsets, and pictures I took of nyc at night, with many pictures coming from my walks!
Steps:

1. Set up simple details like background color and format.

2. Using javascript to accomplish more detailed aspects that I wanted my project to have.

3. Add a function to create squares from divs(which would later function as the images)

4. Make it so that the squares would each show a different image at the beginning by adding a variable so each new square I created would be a new picture(going up to 30 squares)

Steps continued:
5. Add in an event listener, so when I hover over each picture of the sunset, it would change to a new picture of nyc at night.
This is what it looks like in code:

This is the final result:

Sunset project