from source in
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_js_lightbox

My code here:

https://jsfiddle.net/bvotcode/37pj8gv1/4/

example:

<div class="column">
<img src="https://i.imgur.com/eJqEsnz.png" style="width:100%" onclick="openModal();currentSlide(1)" class="hover-shadow cursor">
</div>
<div class="column">
<img src="https://i.imgur.com/LOQjVCz.png" style="width:100%" onclick="openModal();currentSlide(2)" class="hover-shadow cursor">
</div> 

I think it is necessary to use the for each command in case of multiple images.

But I’m not sure how to edit it

Thank you

In this case, there are 4 images, but I want to rewrite the code for the case of more images, array for example 10 images.