Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use a.photoswipe as childSelector in examples #2064

Open
JPustkuchen opened this issue Sep 15, 2023 · 0 comments
Open

Use a.photoswipe as childSelector in examples #2064

JPustkuchen opened this issue Sep 15, 2023 · 0 comments

Comments

@JPustkuchen
Copy link
Contributor

JPustkuchen commented Sep 15, 2023

https://photoswipe.com/ has this example on the frontpage:

<script type="module">
import Lightbox from './photoswipe-lightbox.esm.js';
const lightbox = new Lightbox({
  gallery: '#my-gallery',
  children: 'a',
  pswpModule: () => import('./photoswipe.esm.js')
});
lightbox.init();
</script>

and I'd like to suggest to consider changing this line:
children: 'a',
to
children: 'a.photoswipe',

and use <a class="photoswipe"><img [...]></a> in the markup example.

Alternatively, as shortcut like ps could be used as class for convenience.

Not because it's wrong or wouldn't work, but because it introduces a high risk, if people using it on a broader container. In that case all links in the container are handled as photoswipe links. As a side-effect this results in broken modals for each link that shouldn't be a photoswipe link:
grafik
(Saying "The image could not be loaded")

I know this additional class also has downsides, but on the other hand there might be some frustration, until you find the too broad children match...

So I thought it might make sense to raise this point and discussion.

Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants