API
Core concepts: since
Methods
PhotoSwipeLightbox methods
const lightbox = new PhotoSwipeLightbox({});
// initialize lightbox, should be called only once,
// it's not included in the main constructor, so you may bind events before it
lightbox.init();
PhotoSwipe core methods
You can access PhotoSwipe core instance only after lightbox is opened (for example, within beforeOpen
event).
Basic methods:
const lightbox = new PhotoSwipeLightbox({});
lightbox.init();
lightbox.on('beforeOpen', () => {
const pswp = lightbox.pswp;
// go to slide by index
pswp.goTo(3);
// go to next slide
pswp.next();
// go to previous slide
pswp.prev();
// close the PhotoSwipe (with animation, if enabled)
// PhotoSwipe will automatically destroy after it's closed
pswp.close();
});
Zoom/pan methods
// Include Lightbox
import PhotoSwipeLightbox from '/photoswipe/photoswipe-lightbox.esm.js';
const lightbox = new PhotoSwipeLightbox({
// may select multiple "galleries"
gallery: '#gallery--simple',
// Elements within gallery (slides)
children: 'a',
// setup PhotoSwipe Core dynamic import
pswpModule: () => import('/photoswipe/photoswipe.esm.js')
});
lightbox.init();
{
"template":"getting-started",
"id":"simple",
"displayHTML":true
}
Events
You don't need to unbind PhotoSwipe events or filters, they will automatically be unbound when PhotoSwipe is closed or destroyed.
// TODO
Filters
Properties
// TODO