How to load images on demand (click)?

Question

JavaScript

Good hour.
There is a portfolio on the site, in the portfolio itself - previews are easy, when you click on them, a modal pops up with a full image of the landing page. The problem is that large images are loaded along with all the resources of the site initially, which greatly slows down the initial loading of the site.
How to make images load on demand? That is, a person clicked on the preview and a large image was loaded in the modal window. Thank you.

Answer 1

You are most likely doing something wrong. This is what the preview should look like.

<a href="fullimage.jpg">
   <img src="thumbimage.jpg">
</a>

This way the browser will not load the image from a href, but only the thumbimage.jpg thumbnail