Sorry, the InVision Help Center does not support Internet Explorer. Please download Microsoft Edge or another modern browser.


InVision ambassador ambassador
Francesca Grignani Francesca Grignani

How can I make a large image inspectable?

Hi,

I've just started to use inVision and I'm creating my first prototype. I need to give the user the possibility to see details of a large image in a small window, dragging it (more or less as shown in the picture).
I haven't found useful tutorials or tips to do that yet.
Any suggestions?

Thanks :)

0

comments

sort by


Kayden Knauss
InVision ambassador Kayden Knauss , ambassador
Comment actions Permalink

Hey Fra,

Thank you for reaching out to us. Currently, the animation capabilities allow you to drag within a mask in one direction as opposed to freely around.

Here's how to achieve that:

1. Create the mask with the image
2. Duplicate the artboard and move the image inside the mask to the desired end position
3. Click on the mask and open the Interactions panel on the toolbar
4. Set your Trigger to Drag Right (or whichever direction you would like)
5. Set Navigate to > Artboard Duplicate you created
6. Set Transition > Motion

Feel free to Edit the Timeline or your delay/duration settings to your liking.

If this doesn't solve the behavior you'd like and you wish it to be more robust, please let us know and our team would be more than happy to track this interest as a potential feature.

Hope this helps!

Have a great day,
Kayden

0

join the conversation

to comment, sign up or sign in.