1

I'm struggling to get PhotoSwipe to work with the markup I need. I know the fix is fairly easy, but I can't seem to get it to work properly. Here's the issue:

The Markup on the Getting Started Page is fairly simple:

<div class="my-gallery">

    <figure>...</figure>
    <figure>...</figure>
    ...

</div>

With the Vanilla JS implementation on the page, everything works fine. However, my layout asks for the following markup of my gallery:

<div class="my-gallery">

    <div class="gallery-slide">
        <figure>...</figure>
    </div>

    <div class="gallery-slide">
        <figure>...</figure>
    </div>

    ...

</div>

With this markup, the lightbox part of PhotoSwipe still works fine, however, the gallery detection (Prev & Next Arrows) and UID don't seem to work.

See the problem in this CodePen.

I know this is an issue with the element targeting in the JavaScript, I just don't seem to be able to get it right...

Hopefully you can help!

0 Answers0