<picture> tag support

I am trying to add support for webp image formats with jpg fallbacks. When I write my listener like this the lightbox works as intended:

```
window.addEventListener('load', (event) => {
document.querySelectorAll('.modal').forEach(image => {
image.addEventListener('click', e => {
basicLightbox.create(`

`).show();
});
});
});
```

However, when I write my listener like this, the lightbox does not close when I click on the image, only when I click on the background, making the lightbox difficult to close:

```
window.addEventListener('load', (event) => {
document.querySelectorAll('.modal').forEach(image => {
image.addEventListener('click', e => {
basicLightbox.create(`

`).show();
});
});
});
```

I imagine this has something to do with the `` tag. Any thoughts on why this would be happening? Thanks

issue にある 2 つの listener のバリエーションを再現し、単純な img マークアップと picture/source/img マークアップを比較します。basicLightbox.create(...).show() から開始し、表示されたコンテンツと背景へのクリックがどのように処理されるかを追跡します。picture ベースの WebP フォールバック lightbox が、単純な img 版と同様に画像をクリックすると閉じれば完了です。

索引モデルが issue の本文から書いたものです。