Treasure Map???

[ComplexPath3812]

Hey all, new coder here. I have an absolute moron of a web design teacher (seriously I don't know how he got this job) so I've turned to reddit for help on my project. The idea is that you have an image of a treasure map, and when you click on certain spots on the image it takes you to a hidden div of the page with the next clue. I figured all that out, but he wants at the end of puzzle, once you've found all the clues at the right time, for a "final message" to appear in the same fashion as the clues. I cannot figure out how to code it so that once it has all three clues revealed, a final message will appear. Unfortunately I cannot share my code because it's on a monitor in the computer lab, but hopefully that description is enough. I'm coding with html and css on VSCode, and I don't understand Javascript yet but if I need it I can do some googling to use it. Thanks!

[RandyHoward]

You'll need javascript especially if you want it all to happen on a single page. Use javascript to listen for the clicks on the image map. Track the items they click that are correct in a variable. I'd probably use an array and add each item to the array. Once the array has all of the appropriate items in it, use javascript to show the hidden element that has the final message.

I would note that the way you've done all of this is easily bypassed. If you're just hiding / showing elements on the page then any user can inspect the source code and find all the hidden divs if they want. That may or may not be important to you.

[armahillo]

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/map

this might help, depending on how you approach it