Popularity
2.6
Growing
Activity
8.6
Declining
478
27
80

Description

nanogallery2 is a must have gallery and lightbox. Strengths of nanogallery2 include rich UI interactions, multiple responsive layouts, swipe and zoom gestures, multi-level albums, an HTML page generator and limitless options. Setup and use are simple. The documentation includes tutorials, samples and ready to use HTML pages.

Monthly Downloads: 0
Programming language: JavaScript
Tags: Sliders     Responsive     Touch     Lightbox     Gallery     Swipe     Mobile    
Latest version: v3.0.4

nanogallery2 alternatives and similar libraries

Based on the "Sliders" category.
Alternatively, view nanogallery2 alternatives based on common mentions on social networks and blogs.

Do you think we are missing an alternative of nanogallery2 or a related project?

Add another 'Sliders' Library

README

nanogallery2

modern photo / video gallery and lightbox   [javascript library]

nanogallery2 is a must have gallery and lightbox. Strengths of nanogallery2 include rich UI interactions, multiple responsive layouts, swipe and zoom gestures, multi-level albums, an HTML page generator and limitless options. Setup and use are simple. The documentation includes tutorials, samples and ready to use HTML pages.

version Build Status DeepScan grade <!-- license license --> Twitter

Documentation, Demonstrations and Tutorials

-> Check the homepage of the project

<!--
nanogallery2 youtube demo -->

Features

Markup or Javascript set up

Images

Videos (Youtube, Vimeo, Dailymotion)

Media titles and descriptions, tags

Touch and mobile friendly

Smart lazy loading and displaying

Deeplinking

  • multiple base layouts: grid, cascading/mansonry, justified, mosaic
  • responsive
  • tag/keyword filtering
  • display transition on gallery and thumbnails: reveal items on-scroll in an animated way
  • hover/touch effects
  • tools on thumbnails: social sharing, selection, download, shopping cart
  • pagination, "display more" button
  • albums
  • blurred images for thumbnail preview
  • breadcrumb navigation
  • slider on last thumbnail
  • thumbnails stacks
  • themes ### Lightbox
  • swipe / pinch to zoom
  • mouse and keyboard
  • image rotation / zoom
  • fully customizable toolbars
  • previous/next media transitions
  • smart slideshow
  • themes ### Custom icons ### show media location on google maps ### API / Events / Callbacks ### Fast animation engine ### Builder for quick online testing ### Detailled documentation with samples ### Super customizable ### Optional add-on for automatic publishing of self hosted images: nanoPhotosProvider2


New features and improvements

-> [Check ChangeLog](changelog.md)


Some screenshots
















Usage

HTML markup setup examples:

<body>
  <div id="my_nanogallery2" 
    data-nanogallery2='{ "userID": "[email protected]", "kind": "flickr", "thumbnailHeight": 150, "thumbnailWidth": 150 }'>
  </div>
</body>
  <div id="my_nanogallery2" data-nanogallery2 = '{ "itemsBaseURL": "https://mywebserver/gallery/myimages/"}' >
    <a href="img_01.jpg" data-ngthumb="img_01t.jpg"  data-ngdesc="Description1"        >Title Image1</a>
    <a href="img_02.jpg" data-ngthumb="img_02ts.jpg" data-ngdesc="Image 2 description" >Title Image2</a>
    <a href="img_03.jpg" data-ngthumb="img_03t.jpg"                                    >Title Image3</a>
  </div>
  <div id="my_nanogallery2" data-nanogallery2  >
    <a href="img/img_01.jpg">Title Image 1
      <img src="img/img_01_thumbnail.jpg"/>
    </a>
    <a href="img/img_02.jpg">Title Image 2
      <img src="img/img_02_thumbnail.jpg"/>
    </a>
    <a href="img/img_03.jpg">Title Image 3
      <img src="img/img_03_thumbnail.jpg"/>
    </a>
  </div>

Package managers

npmjs: npm install nanogallery2

License

Dual licensed:

  • GPLv3 for personal or open source projects with GPLv3 license
  • Commercial license for use in a revenue-generating product

Requirements

  • Javascript must be enabled
  • jQuery 1.12.4+ (not compatible with v3.0/v3.1, because of a jQuery regression described here )

Many thanks to these technology contributors:

 
 
Many thanks to BrowserStack for their great testing services!


*Note that all licence references and agreements mentioned in the nanogallery2 README section above are relevant to that project's source code only.