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.
nanogallery2 alternatives and similar libraries
Based on the "Sliders" category.
Alternatively, view nanogallery2 alternatives based on common mentions on social networks and blogs.
-
Swiper
Most modern mobile touch slider with hardware accelerated transitions -
impress.js
It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com. -
PhotoSwipe
JavaScript image gallery for mobile and desktop, modular, framework independent -
Glide.js
A dependency-free JavaScript ES6 slider and carousel. It’s lightweight, flexible and fast. Designed to slide. No less, no more -
Splide
Splide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors. -
Embla Carousel
A lightweight carousel library with fluid motion and great swipe precision. -
Keen-Slider
The HTML touch slider carousel with the most native feeling you will get. -
Sequence
The responsive CSS animation framework for creating unique sliders, presentations, banners, and other step-based applications. -
sly
JavaScript library for one-directional scrolling with item based navigation support. -
vegas
Vegas is a jQuery/Zepto plugin to add beautiful backgrounds and Slideshows to DOM elements. -
basic-jquery-slider
Simple to use, simple to theme, simple to customise. -
vue-slick-carousel
🚥Vue Slick Carousel with True SSR Written for ⚡Faster Luxstay -
Swiffy Slider
Super fast carousel and slider with touch for optimized websites running in modern browsers. -
jcSlider
:snowboarder: A responsive slider jQuery plugin with CSS animations -
jQuery.adaptive-slider
A jQuery plugin for a slider with adaptive colored figcaption and navigation. -
(🧪 Early Alpha)🤙 TamoTam. HangOut. Offline.
(🧪 Early Beta) 🤙 TamoTam. HangOut. Offline.
SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
* Code Quality Rankings and insights are calculated and provided by Lumnify.
They vary from L1 to L5 with "L5" being the highest.
Do you think we are missing an alternative of nanogallery2 or a related project?
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.
Documentation, Demonstrations and Tutorials
-> Check the homepage of the project
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
Gallery
- 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:
<div id="my_nanogallery2"
data-nanogallery2='{ "userID": "34858669@N00", "kind": "flickr", "thumbnailHeight": 150, "thumbnailWidth": 150 }'>
</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>
<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>
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:
- for shifty: Jeremy Kahn - special thanks for all your help!
- for imagesloaded: David DeSandro
- for screenfull.js: Sindre Sorhus
- for Hammer.js: Alexander Schmitz, Chris Thoburn, Jorik Tangelder
- for fontello.com: Vitaly Puzrin
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.