PhotoSwipe

 JavaScript image gallery for mobile and desktop, modular, framework independent.

photoswipe.com

JavaScript image gallery for mobile and desktop.

• Documentation and getting started guide.
• Demo and script home page.
• NPM npm install photoswipe.
• Bower bower install photoswipe.

Location of files

• Compiled PhotoSwipe JS and CSS files, SVG and PNG sprites are in the dist/ folder.
• Source files (.JS and .SCSS) are in the src/ folder. Note that PhotoSwipe uses Autoprefixer when compiling SASS files.
• Demo website is in the website/ folder.
• Documentation markdown files are in website/documentation/.

Plugins / extensions / addons

• Ruby gem.
• Ember.js addons: ember-photoswipe, ember-cli-photoswipe.
• Eager app.
• Koken CMS plugin.
• Orchard CMS module.
• Yellow CMS plugin.
• Kirby CMS plugin.
• Drupal CMF module.
• ProcessWire CMS module.
• SPIP CMS module.
• Fork CMS MediaLibrary widget.

Coded something useful? Email me and I’ll post a link to it here.

Build

To compile PhotoSwipe by yourself, make sure that you have Node.js, Grunt.js, Ruby and Jekyll installed, then:

1. Clone the repository

   git clone https://github.com/dimsemenov/PhotoSwipe.git

2. Go inside the PhotoSwipe folder that you fetched and install Node dependencies

   cd PhotoSwipe && npm install

3. Run grunt to generate the JS and CSS files in the dist folder and the site in the _site/ folder

   grunt

Optionally:

• Run grunt watch to automatically rebuild files (JS, CSS, demo website and documentation) when you change files in src/ or in website/.
• Run grunt nosite to build just JS and CSS files (output is folder dist/).
• Run grunt pswpbuild to build just JS files. Param --pswp-exclude allows to exclude modules, for example grunt pswpbuild --pswp-exclude=history will exclude history module.

Using PhotoSwipe?

If you’ve used PhotoSwipe in some interesting way, or on the site of a popular brand, I’d be very grateful if you shoot me a link to it.

from https://github.com/dimsemenov/PhotoSwipe