code.Atomic8Ball.com

Image Gallery Lightbox Usage Instructions

  1. Load CSS
    https://code.a8b.co/lightbox2/css/lightbox.min.css
  2. Load JS
    https://code.a8b.co/lightbox2/js/lightbox.min.js
  3. <a href="PATH_TO_IMAGE" data-lightbox="IMAGE_ID"><img src="PATH_TO_IMAGE_THUMB" alt="" /></a>
  4. All items that have the same IMAGE_ID will display "Image X of Y" and have forward and backward arrows to navigate through them.
  5. data-title="IMAGE_TITLE" is an optional element on the <a> tag, and will display on the overlay.

Further reading and additional options: http://lokeshdhakar.com/projects/lightbox2/