Need help with my design

Hello everyone,

I’m currently in the process of developing a website for my brother, and although we’ve finalized the design, I’m encountering difficulties implementing a specific feature. Specifically, I aim to establish a target point on an image, whereby clicking on it triggers a zoom-in effect on the image accompanied by the display of a feature description.

Additionally, I’m facing an issue where the designated target point does not remain in place with the image when resizing the screen.

I’ve included a video demonstrating the functionality in Figma and provided a link to the Webflow design for your reference.

I appreciate any assistance you can provide. Thank you!

[1]: Figma file: (https://www.figma.com/proto/q9ED2Obv0KU6TcWMw4puG1/cafeparacasa?page-id=0%3A1&type=design&node-id=589-6443&viewport=-5926%2C205%2C0.12&t=gBPbYgtZDTQAXI6m-1&scaling=scale-down&starting-point-node-id=574%3A4898&mode=design)

[2]: Webflow design: Webflow - cafeparacasa

I don’t have a specific recommendation for the zoom-in, you might be able to do it with interactions but you’d be building an on-click interaction or on-hover interaction for each of your hotspots.

For the hotspots, you can get them to stay in-position on the image using this technique-

Thanks for the help. I was able to create the interactions. The hotspots I follow the video but they still moving out of place.