Hi there, I’m working on prototyping.
There are problems when I make interaction with components that have images.
I’m not sure if images are the problem or not.
Error1: I applied hover animation on images, it does not work, but for button it works.
Error2: I made a carousel with 3 images. It works A to B to C, C to B, but not B to A.
the same error happened before on another project. On other’s browser there was not problem. Then it became fine on my laptop too.
If there is already the same topics here, sorry.
Thank you in advance.
Ayako
I attached the Figma link. It would be nice anyone can solve it!
Please search for existing topics before posting! Press at the upper right to search.
Hi @Ayako! I was attempting to review the flows in the example file you provided, but it is view-only so I wasn’t able to see anything beyond the flow. I do see that the images in example one are not working as you intend, but not quite sure why.
Could you adjust the file to have open edit access? If you are unable to do that publicly, let me know and I can get you set up with support to have this looked at further.
Error 1: Try resetting the changes applied to the components that you’re using. I duplicated your file, and doing that did the trick of solving the issue. (: My guess is something to do with positioning or maybe the order in which you made the interactions, it may have caused it to create undesirable modifications.
Error 2: I’m not sure if there’s other workaround for that, it’s not something I’m used to having to deal with, but I think I achieved the desired behavior using a rectangle for each side of the image container and using the right one for going forwards and the left one for going backwards.
You can take a look at the duplicated file and its changes here.
^ You might be able to duplicate and use this to guide your design.
Second, try to create each state of the active carousel object for all variants rather than just a different object to cycle through in each variant. You can work viewport/clip content magic with the rest of the carousel objects (if you don’t want them to be visible).
Hi @Benilio Thank you for taking a look! It works perfectly on your file.
I see your trick for error 2. Amazing.
Still don’t understand about error 1. (So it is late to response here…)
Does “Resetting” mean delete prototyping interaction ? I could not find any difference between mine and your setting. And also I don’t know why all 6 pictures work fine on your file as I had only 2 components/Pictures there.
About error 1, when I say “resetting” I’m talking about the option available when you left click a component instance “Reset all changes”. That “cleans” your istance of any changes that you may have made to it, including resizing, rotating etc. So it goes back to the exact same version of the original component!
As to why all 6 of them work, it’s because all I did was that, reset the changes in all of them at the same time, so I didn’t have to do any modifications in the original components, so even though the file doesn’t have the original component for the other ones in here, it just resets it to its initial state.
at the upper right to search.
