Responsive Photo Gallery with Image Lazy Load Effect - jQuery Least Plugin

Least.js is a responsive jQuery plugin which enables to you to create a photo gallery with image lazy load functionality. When clicking on a thumbnail, it will displays the large version of the image and the others will scroll down. When closing the current view, it will move back to the initial position while the other thumbnails come back up again.

Related Plugins:

• Responsive Lightbox Gallery Plugin with jQuery and HTML5 - superbox
• Responsive Fullscreen Layout with Fancy Page Transitions - Box Layout
• Responsive Full Width Grid Layout with Pure CSS

How to use it:

1. Include jQuery library, jQuery lazyload plugin and Least.js on your web page

<script src="js/jquery.min.js"></script>
<script src="js/least.min.js"></script>
<script src="js/jquery.lazyload.js"></script>

2. Include least.css to style your plugin

<link href="css/least.min.css" rel="stylesheet" type="text/css" />

3. Markup html structure

<!-- Least Gallery -->
<section id="least">

  <!-- Least Gallery: Fullscreen Preview -->
  <div class="least-preview"></div>

    <!-- Least Gallery: Thumbnails -->
    <ul class="least-gallery">
      <!-- 1th thumbnail -->
        <li>
          <a href="path-to-your-fullscreen-image default-path:src/media/big/01.jpg" data-subtitle="View Picture" data-caption="Now it's possibe to add an URL-Link into caption text - <a href='http://www.google.com' target='_blank'>GOOGLE</a>" >
            <img src="path-to-your-thumbnail-image default-path:src/media/thumbnails/01.jpg" alt="Alt Image Text" />
          </a>
        </li>
    </ul>

</section>
<!-- Least Gallery end -->

4. Initialize the plugin with default settings.

$(document).ready(function(){
  $('.least-gallery').least();
});

5. Available settings.

'random': true, // Choose between RECENT or RANDOM thumbnails
'scrollToGallery': true, // Scroll to fullscreen preview
'HiDPI': false // Show '@2x' images on HiDPI devices

Change log:

v2.2.0 (2014-07-10)

• added new flat close icon
• added new flat loading icon (thx Brent Jackson @jxnblk)
• added codekit config-files
• addes source map for .js and .css files
• added new option: add a link into your caption element
• added new option: title and caption are now editable as html-attribute

v2.0.1 (2014-01-21)

• update to least.js-2

v1.5 (2013-07-23)

• LazyLoad loading bugfix

---

This awesome jQuery plugin is developed by kamilczujowski. For more Advanced Usages, please check the demo page or visit the official website.