How can I make a lightbox with a hover zoom effect?

Design help Custom code
1

For a client project, I need to make a small lightbox that allows the user to hover over the lightboxed image and zoom in (the image in question is a newspaper article that’s illegibly small unless zoomed). The user should be able to click between the images via arrows or thumbnails without leaving the lightbox. CMS is not being used and the lightbox gallery will only have two static images. Googling hasn’t been too helpful, as a lot of the results I get are quite old and have a lot of broken links.

Is there a good custom code solution for this? The stock Webflow lightbox would be great, except I can’t interact with the media chosen to display in the lightbox to enable a zoom effect. My javascript is very poor so I haven’t been able to figure this one out on my own.

2

Still hoping to find a solution for this!

3

For anyone who finds this thread later:

I was finally successful in accomplishing my needed features through Zoombox by thewebmonk/Ashish Patel! Note that the required JS must be externally hosted. I had luck with this through uploading the js to my personal github and then using jsDelivr to get a usable link.

4

Hey man, can you provide help with this? I hosted the js and css on Netlify, grabbed the link, pasted this into Webflow with help of chatgpt and nothing. A short video or explanation would help a lot.