vue-lightbox

Simple lightbox component for vue
14,001
Install
npm install vue-lightbox
Latest Version:1.1.6
Vue:2
License:MIT
Last Updated:May 3, 2017
Links: npm
Maintainer: phecko

vue-lightbox

Simple lightbox component for vue

How to use it

Example on jsbin

# import 
import VueLightbox from 'vue-lightbox'
Vue.component("Lightbox",VueLightbox)

or

var VueLightbox = required('./vue-lightbox.js') 
or
<script type="text/javascript" src="./vue-lightbox.js"></script>
Vue.component("Lightbox",VueLightbox.VueLightbox)




# use
# some album pictures will be grouped
<lightbox src="http://pic1.jpg" caption="this is pic caption" album="albumA"></lightbox>
<lightbox src="http://pic2.jpg" caption="this is pic caption" album="albumA"></lightbox>
<lightbox src="http://pic3.jpg" caption="this is pic caption" album="albumB"></lightbox>

Options

prop type required default desc
src String yes picture url
album String no "" group of pictures
caption String no "" some picture desc will display under the popup
show-index Boolean no true show the picture number index
index-tmpl String no "${d} of ${total} images" picture number index tmpl,${d} will be replace by index,${total} will be album's picture count
click-overlay-hide Boolean no true is click to close lightbox

Todo

  • add watch when props change

  • test for different browser

Version History

Version Released License
1.1.6 MIT
1.1.5 MIT
1.1.4 MIT
1.1.2 MIT
1.1.1 MIT