Swipebox | A touchable lightbox for the Rails asset pipeline
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
lib
test
vendor/assets
.gitignore
.travis.yml
Gemfile
Gemfile.lock
MIT-LICENSE
README.md
Rakefile
swipebox.gemspec

README.md

Swipebox for Rails

Gem Version Build Status Code Climate Dependency Status

Swipebox | A touchable jQuery lightbox for the Rails asset pipeline

Installation

Add this line to your application's Gemfile:

gem 'swipebox'

Usage

In your CSS manifest file:

*= require swipebox

In your JavaScript manifest file:

//= require swipebox

Use a specific class for your links and use the title attribute as caption.

<a href="big/image.jpg" class="swipebox" title="My Caption">

Bind the swipebox behaviour on every link with the 'swipebox' class.

$('.swipebox').swipebox();

###Options

useCSS: true, // false will force the use of jQuery for animations
useSVG: true, // false to force the use of png for buttons
initialIndexOnArray: 0, // which image index to init when a array is passed
removeBarsOnMobile: true, // false will show top navigation bar on mobile devices
hideCloseButtonOnMobile: false, // true will hide the close button on mobile devices
hideBarsDelay: 3000, // delay before hiding bars on desktop
videoMaxWidth: 1140, // videos max width
beforeOpen: function() {}, // called before opening
afterOpen: null, // called after opening
afterClose: function() {}, // called after closing
afterMedia: function() {}, // called after media is loaded
loopAtEnd: false, // true will return to the first image after the last image is reached of Bootstrap)
autoplayVideos: false, // true will autoplay Youtube and Vimeo videos
queryStringData: {}, // plain object with custom query string arguments to pass/override for video URLs,
toggleClassOnLoad: '' // CSS class that can be toggled when the slide will be loaded (like 'hidden' of Bootstrap)

Look at the original Swipebox repo for more.

I have modified source a bit from the 1.4.4 version:

  • SCSS instead of CSS because we need the image-url helpers
  • .png -> .svg via class not hardcoded image path

License

The MIT License