Armani

In this class I enjoyed working with the CSS animations. There's a lot you can do with CSS, but I found animations to be one of the more enjoyable aspects as I created my series.

Here are some examples of what I did for hovering and color changing effects.

Example of css-based hovering animation.
Example of css-based color changing animation.

It took a while to understand but now I can do these kinds of things for future sites, so I'm happy I got to explore their capabilities while doing my series.

MC

code of changing background script
Example of css-based color changing animation.

I had a lot of fun using js to format the interactive home page in my website. I wanted to originally create a random background generator, but since I didn't have that many bg photo files, I just made it a button selector. It was quick to write and seeing the buttons actually work felt very rewarding.

Amanda

When I look back at our class's adventures in CSS, this thing I think about the most is learning the different types of display. Before I decided on an image map, I tried a lot of different types of "display" commands until I found one that worked.

When I returned to my website to implement changes, one was making my navigation bars images. This was really frustrating to code bc the display was incredibly finnicky no matter what I chose. In the end, I ended up going for a simple display, but this frustration carried over into my event webpage, which included a lot of photos.

As seen above in my code, I had to learn flex display for the photos to work. Google helped me a lot as I tried to figure out what to do. However, I now feel more prepared to do it again.

Megan

I used js to create elements that were draggable and randomized. Every time the page is refreshed, the Hangul letters scatter. I initially had trouble with confining the random placement to the boundaries of the div container, but I eventually found a way to adjust the script so that the letters remained within the viewport.

Kelly

Making the homepage grid for my Series was definitely the hardest part of my website. Trying to get the boxes right and organize them on the page with the correct borders proved to be a challenge, especially as I chose to use a new CSS tool, grid, in order to do it. The code for making it is below. It took a lot of trial and error, but I eventually got the boxes aligned and was able to set their individual properties with colors and hover images.

Code for making the boxes for the homepage grid
Styling for making the grid on the homepage
Ally

I really enjoyed thinking through the layout of my website. I struggled a lot in the beginning because I did not understand how to use containers, the difference between blocks and in-line, etc. and also became very frustrated at some points. Overall, I am glad I learned the fundamentals of website layouts and hope to explore more adventurous designs for my future websites.

Sophie

I LOVE FLEX BOXES. I used to hate them so so so much because I could not figrue out how to work them to save my life. Now, I probably use them too much. AND FLEX

Laurel

This is super interesting to see! I love that people are proud of certain pieces of code they've written.