Swipebox | A touchable jQuery lightbox for the Rails asset pipeline
Add this line to your application's Gemfile:
gem 'swipebox'
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
initialIndexOnArray: 0, // which image index to init when a array is passed
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
loopAtEnd: false // true will return to the first image after the last image is reached
Look at the original Swipebox repo for more.
I have modified source a bit from the 1.3.0.1 version:
- SCSS instead of CSS because we need the
image-url
helpers - .png -> .svg via class not hardcoded image path