Three clickable images in one figure, how?

Site URL: https://arena-2.squarespace.com/approach

Help needed. 
 

I want to make one figure out of three different overlapping images. Each image being clickable. And when one image/layer is clicked, then it comes to the front. 
 

how could I do this? 
 

Hmm. I guess I would need to place the three images differently, so that clicking changes order and size change isn’t necessary. Unless some really advanced feature is possible for making interactive graphics. 

I see you want a stack of three different sized photos, almost like three windows one on top of the other. Interesting. I would think that a slide show with three images and css code to size the three different might work. But then how do you get them all up at the same time, not one at a time?  This will take a bit of research but it doesn't seem impossible. Its like picture one is up, you can see the whole image, two is a border for one and three is a border for two. I would like to figure out how to do this as well. 

Thanks for thinking along 🙂. I guess a more simple solution would be using the different images that each contain all 3 squares but in different order. So instead of Interactive shifting between  singular squares placed in layers, I would have premade images of each set. 
 

I don’t want slide show, but shifting images by clicking on a stack. THAT should be possible, right?

I still don't figure how you get them behind each other, but if you are talking about making three images that simulate the look you want, each with a different image as the first (top) image, and putting those images in a gallery,  I see where that might work. It would take a bit of post image work to do, to end up with three images of three "sets" of images.  I think you are on to a possible way to do what you want.