I was playing with interactive variants and Im getting a strange jumpiness happening. Here are whats happening:
Here’s a prototype of it Test Page
I’m not able to reproduce any jump on the menu. Did you tried restarting your prototype, or maybe there’s something I’m not seeing.
So once you expand it and hover to get the tool tips, its not shifting?
If you refer to the icon rotating? That must be related to a smart animate effect on the transition
Sorry. What Im saying is after those icons appear below, if you hover over them, there is a tooltip that appears to the left, then you’ll see the shifting Im referring to.
The width of your frame is not including the tool tips, so it’s jumping over. Change the width size of the frame to include the tooltips at every stage of the menu.
That worked! Seems a bit clunky, but that also makes sense. I kept trying to make it so it was justified or fixed to the right and jump the other way but that wasn’t working. Thank you!
Thank you for sharing a solution! If it’s not too much trouble, would you mind explaining this a bit more? I’m running into the same issue where one of my interactive variants that has a fixed position when scrolling is jumping on hover. I tried your fix, but I must be doing something wrong because it’s still not working for me.
@iharwood Look up in the comments above that answered it for me. Basically what I had to do was make the starting state height and width expanded to accommodate everything that shows after I click it. So I wanted a button on click to show other options. That first button before clicked has to include the spacing for when everything shows. Thats what’ll keep things from jumping around.
aah, I understand now! Thank you for breaking it down for me, this has fixed my issue and I appreciate it!
This is not a proper solution. What if I am using auto layout and the clunky component (inclusive of width of all the states) moves everything out of order??