A javascript lightbox allows us to view full$-$size images by clicking on image thumbnails.

Here's what you'll be building. $($Click on any of the small images.$)$

Let$$s create a lightbox gallery using the Luminous Javascript library:

Make a copy of your working index.php file. Call this copy: lightbox.php

Modify lightbox.php to only display your locally stored images.

Remove the links to the photographer$$s Unsplash pages.

Make thumbnail versions of all your images that are $300$ pixel wide. Name each thumbnail with $\_$thumbnail at the end of the filename.

Example: mountain.jpg becomes mountain$\_$thumbnail.jpg$.$

Modify each image such that the thumbnail displayed within a link to the fullsize image. For example:

Add these CDN$-$served link and script tags to your HTML head element:

Add the following script tag directly above your closing tag:

This step assumes that the CSS selector $".$image a$"$ targets all the link tags you$$ve got your images stored within. Modify as required, If you used different HTML from the example.

Check if your gallery looks and acts like the provided example.