You are using 29 GB
Magnific Popup is a responsive lightbox & dialog script with focus on performance and providing best experience for user with any device. Demo page.
To use the plugin,you need to add the following files.
<!-- CSS --><link rel="stylesheet" href="libs/lightbox/magnific-popup.css" type="text/css"><!-- Javascript --><script src="libs/lightbox/jquery.magnific-popup.min.js"></script>
<a class="image-popup" href="big-image.jpg"><img src="small-image.jpg" alt="image"></a>$('.image-popup').magnificPopup({type:'image',zoom:{enabled:true,duration:300,easing:'ease-in-out',opener:function(openerElement){return openerElement.is('img') ? openerElement:openerElement.find('img')}}});
<div class="row"><div class="col-md-2 m-b-15"><a class="image-popup-gallery-item" href="big-image.jpg"><img src="small-image.jpg" class="img-fluid" alt="image"></a></div><div class="col-md-2 m-b-15"><a class="image-popup-gallery-item" href="big-image.jpg"><img src="small-image.jpg" class="img-fluid" alt="image"></a></div><div class="col-md-2 m-b-15"><a class="image-popup-gallery-item" href="big-image.jpg"><img src="small-image.jpg" class="img-fluid" alt="image"></a></div><div class="col-md-2 m-b-15"><a class="image-popup-gallery-item" href="big-image.jpg"><img src="small-image.jpg" class="img-fluid" alt="image"></a></div><div class="col-md-2 m-b-15"><a class="image-popup-gallery-item" href="big-image.jpg"><img src="small-image.jpg" class="img-fluid" alt="image"></a></div><div class="col-md-2 m-b-15"><a class="image-popup-gallery-item" href="big-image.jpg"><img src="small-image.jpg" class="img-fluid" alt="image"></a></div></div>let magnificPopupGalleryConfig ={type:'image',gallery:{enabled:true},zoom:{enabled:true,duration:300,easing:'ease-in-out',opener:function(openerElement){return openerElement.is('img') ? openerElement:openerElement.find('img')}}};$('.image-popup-gallery-item').magnificPopup(magnificPopupGalleryConfig);