Google+ Like Image Carousel / Gallery Plugin With jQuery - plusGallery

File Size: 4.84 KB
Views Total: 1958
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Google+ Like Image Carousel / Gallery Plugin With jQuery - plusGallery

plusGallery is a Google+ inspired, touch-friendly, jQuery / HTML5 gallery plugin which organizes and displays all your images of different heights and widths in a smoothly scrolling carousel interface.

How to use it:

1. Link to the jQuery plusGallery and other required resources as follow:

<link rel="stylesheet" href="css/jquery.plusgallery.css">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="js/jquery.plusGallery.js"></script>

2. Insert your images together with the overlay text and navigation controls into the gallery.

<div class="myplusgallery" style="position: relative;">
  <div class="img-prev" title="Previous Image">&#8249;</div>
  <div class="img-next" title="Next Image">&#8250;</div>
  <div class="img-overlay">
    <p>Pictures from <br>
    <a href="//www.google.com">Google.com</a></p>
  </div>
  <div class="img-slide">
    <figure>
      <img src="1.jpg" alt="Image Alt" />
    </figure>
    <figure>
      <img src="2.jpg" alt="Image Alt" />
    </figure>
    <figure>
      <img src="3.jpg" alt="Image Alt" />
    </figure>
    <figure>
      <img src="4.jpg" alt="Image Alt" />
    </figure>
    <figure>
      <img src="5.jpg" alt="Image Alt" />
    </figure>
  </div>
</div>

3. Initialize the gallery plugin by call the function on the top container as this.

$('.myplusgallery').plusGallery();

How to use it:

2018-05-12

  • use moverange to move left or right for mouse and touch

2016-12-20


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