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