Project

swipebox

0.02
No commit activity in last 3 years
No release in over 3 years
Swipebox | A touchable lightbox for the Rails asset pipeline.
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
2025
 Dependencies

Development

Runtime

< 6.0, >= 3.1
< 6.0, >= 3.1
 Project Readme

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