HTML/CSS/JS 1st project

Hey all,

I just joined Codecademy a month or so ago and after going through a few courses I finally finished a 1st draft of my project. Its a where’s waldo of cats, I made it to practice some gridbox and flexbox tricks, as well as integrate a little starting javascript.

This is the site

and I have the code available here … I think:

I’d love feedback as to where I could optimize the code! Specifically I’m wondering if I can use javascript to iterate through the numbers in the btn and modalbox js functions so that it will automatically create a new button if I wanted to add more images. I was also thinking about trying to have it randomly generate spots for the paws on the grid.

I also noticed that the site is a little broken on mobile. I’m sure I have some errors in my CSS declarations, but I’m still working through some trial and error on that.


Edit!!: I should have also mentioned I borrowed the code to make the modal boxes and then modified it, I’ll hunt down the original source now and post.
Original Source for Modal Boxes:


After several clicks, I finally got a cute cat photo saying “Kibble, pleeeaaasseee!” I couldn’t find any actual cat paws to click on. I am using a MacAir to test this. Love, LindaJoyfulCoder

1 Like

The cat paws are there, they’re just a bit transparent. Took me a while to find though, and I was rewarded with cute cat pics with each click. Nicely done. :cat: :cat: :cat:

I was actually able to see all the paws after highlighting the image using my mouse:
You can prevent this by using:

user-select: none;

in the html/body CSS selector.