A Lightbox plugin written in TypeScript.
Using npm:
$ npm install panda-box --save
or yarn:
$ yarn add panda-box
Then import it in your javascript files:
import PandaBox from 'panda-box';
Also make sure that you include styles:
import 'panda-box/dist/pandaBox.css';
Add attribute data-pandabox
to container of gallery and call new PandaBox();
Or pass your own selector to class constructor:
new PandaBox('.galleryContainer')
A gallery must be in a form of <img src="#">
with a <a href="#">
wrap eg.:
<div data-pandabox>
<a href="1.jpg">
<img src="1-thumb.jpg" />
</a>
<a href="2.jpg">
<img src="2-thumb.jpg" />
</a>
</div>
Add data-title attribute with string inside it to attach title to image.
Add data-description attribute with string inside it to attach description to image.
IE 11+, all evergreeen browsers