How to make an image zoomable by hovering with mouse?

I have a text component that has some HTML in it do create an image with inlined CSS style. I do this because I wanted some variables in the CSS, and I wasn't sure how to do this with retools global CSS stylesheet.

I'm trying to create a mouse hover zoom for the image, so I can move my mouse around and look at specific parts of the image, but I get stuck because I can't seem to get access to document in javascript to edit things by id or something like that, and that issue with the global CSS stylesheet. Any tips? Thanks.

Hey @sia, since all JS in Retool is run in a Sandbox you won't be able to access the document. You should be able to create a Custom Component with an image that you can zoom on hover though!

1 Like