For this project, I had to create an interactive photo gallery using JavaScript and jQuery. Thumbnails and photos were provided with descriptions for me to implement as project material. At the top of the page, I had to include a search area where photos hide and show depending on user input. When the user clicks on a thumbnail, the photo will display in a lightbox. The photo gallery also needed to consist of back and previous arrows to allow the user to cycle through the photos.
I went for the Exceeds Expectations Grading where I had to:
- Write my own JavaScript and jQuery code instead of using a jQuery plugin for the search/content filtering requirement.
- Include a mobile-first approach for both the gallery page and the lightbox, by utilising media queries to ensure that photos and layouts adjust for a mobile-friendly experience.
Browsers tested for compatibility:
- Chrome
- Firefox
- Edge
Grade: Meets Expectations