I’ve been nerd sniped.
A few weeks ago, Raymond Camden posted about An Image Dialog Web Component and I read that article, added some discussion about how you’d style it, then promptly stopped thinking about it… _ consciously _. I think it’s been floating around in the back of my brain because another colleague recently asked what lightbox scripts people were using with astro and other SSGs. My immediate thought was “Well, that should be a web component…” completely forgetting that Raymond made a post about it nearly a month prior.
Anyway, I made my own version.
light-box by Alex Riviere (@fimion)
on CodePen.
This version is a bit more forgiving than Raymond’s. It looks for any link with an image inside of it. Which makes it easier to use it with a list, or whatever nested structure you want. It also allows for multiple images and then will give you previous and next buttons based on what is there, but will limit itself to the contents of the current light-box.
Anyway, You’re welcome. Go use this for good.
Or chaos.
Have fun.
Top comments (0)