snitchbot | Dashboard & Remote Field Sensing

Lightbox

Lightbox is a small javascript library used to overlay images on top of the current page. It's a snap to setup and works on all modern browsers.

Lightbox documentation

Stylesheet

<link href="assets/lib/lightbox2/css/lightbox.min.css" rel="stylesheet">

Javascript

<script src="assets/lib/lightbox2/js/lightbox.min.js"></script>

Example

<a href="../assets/img/gallery/6.jpg" data-lightbox="Image" data-title="caption"><img class="img-fluid rounded" src="../assets/img/gallery/6.jpg" alt=""></a>

Gallery

<div class="row">
  <div class="col-sm-4 col-lg-3 mb-4">
    <a href="../assets/img/gallery/1.jpg" data-lightbox="group" data-title="caption"><img class="rounded img-fluid" src="../assets/img/gallery/1.jpg" alt=""></a>
  </div>
  <div class="col-sm-4 col-lg-3 mb-4">
    <a href="../assets/img/gallery/2.jpg" data-lightbox="group" data-title="caption"><img class="rounded img-fluid" src="../assets/img/gallery/2.jpg" alt=""></a>
  </div>
  <div class="col-sm-4 col-lg-3 mb-4">
    <a href="../assets/img/gallery/3.jpg" data-lightbox="group" data-title="caption"><img class="rounded img-fluid" src="../assets/img/gallery/3.jpg" alt=""></a>
  </div>
</div>