trvswgnr / bs5-lightbox

A pure JS lightbox gallery plugin for Bootstrap 5 based on the Modal and Carousel components
https://trvswgnr.github.io/bs5-lightbox/
MIT License
125 stars 28 forks source link

The modal window with images appears two times. #44

Closed alexius closed 1 year ago

alexius commented 1 year ago

Hi everybody,

could you help me to figure out why the modal window with images gallery appears two times on the page?

I call my JS function ones to generate a lightbox gallery: function initLightboxForImages(elemId) { document.querySelectorAll(elemId + ' a.detail_img').forEach(el => el.addEventListener('click', (e) => { e.preventDefault(); const lightbox = new Lightbox(el); lightbox.show(); })); }

The images on the page (see attached file)

When there is one image for showing, the modal window appears one time.

When there are more than one picture, the modal window appears two times. 1

I click on image from the other modal window, which appeared before. Maybe some collision with other modal window?

Thank you!

alexius commented 1 year ago

I just did in the wrong way.

Here is the right way: function initLightboxForImages(elemId) { document.querySelectorAll(elemId + ' a.detail_img').forEach(el => el.addEventListener('click', Lightbox.initialize)); }

I call this function after first modal window appeared and Ajax request returned me the data with images.