HTML/CSS/JS 1st project

[wiegand92]

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 https://wiegand92.github.io/fluffy-cat/

and I have the code available here … I think: https://github.com/Wiegand92/fluffy-cat

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.

Thanks!
-Alex

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: https://www.w3schools.com/howto/howto_css_modals.asp

[lindajoyfulcoder]

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

[cigwe4613711068]

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.

[canarygrapher]

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.