🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

Image gallery for jQuery. Powerful and easy to use image gallery with support for pulling in Flickr and Picasa/Google+ photo albums as well. Mobile-friendly and responsive. Smooth in/out transitions. Images are shown as clickable thumbnails, which will expand to full view via a modal popup window. Support custom themes.Features:Display image galleryEasy to setup and customizableResponsive layout – mobile friendlySmooth in/out transitionDisplay image captions and descriptionsBreadcrumb for easy navigation in photo albumsIgnore undesired albums or photosets (by keyword blacklisting)Multiple galleries on one pageDelivered with multiple themes – Support custom themesSupported image sources :list of imagesFlickr accountPicasa/Google+ account

Gallery Other API Plugins Slider

Documentation

nanoGALLERY - image gallery for jQuery






nanoGALLERY's successor, is available: nanogallery2

nanogallery2

Please note that nanoGALLERY will continue to be maintained for fixing show-stopper bugs, but no new features should be expected.






Image gallery simplified.

Touch enabled, fully responsive, justified/cascading/grid layout and supporting cloud storage.

Featuring multi-level navigation in albums, combinable hover effects on thumbnails, responsive thumbnail sizes, multiple layouts, slideshow, fullscreen, pagination, image lazy load, themes, deep linking, customizable, i18n, and pulling in Flickr or Picasa/Google+/Google Photos photo albums among others.

Usage can be as easy as:

	jQuery('#elt').nanoGallery({ 		kind : 'picasa', 		userID : 'YourUserID' 	});

View ChangeLog

Documentation, Demonstrations and Tutorials

Visit the nanoGALLERY homepage: http://nanogallery.brisbois.fr

Animation
Screenshot1 Screenshot2 Screenshot3

Package managers

Bower: bower install nanogallery
npm: npm install nanogallery

Usage example with images from a Flickr account

Include JS and CSS files

<!-- Add jQuery library (MANDATORY) --> <script type="text/javascript" src="third.party/jquery-1.7.1.min.js"></script>   <!-- Add nanoGALLERY plugin files (MANDATORY) --> <link href="css/nanogallery.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="jquery.nanogallery.js"></script>

Create a container

Put a <DIV> element in the <BODY> of your HTML. This DIV is the placeholder for the gallery.

<div id="nanoGallery1"></div>

Initialize the script

jQuery(document).ready(function () { 	jQuery("#nanoGallery1").nanoGallery({ 		kind:'flickr', 		userID:'34858669@N00' 	}); });

License

nanoGALLERY is licensed under CC BY-NC 3.0.
Only for personal, non-profit organizations, or open source projects (without any kind of fee), you may use nanoGALLERY for free.

Requirements

  • Javascript must be enabled
  • jQuery 1.7.1

Thanks

Testing services provided by BrowserStack


You May Also Like