Mouse enter/leave flickering

Thank you so much! Was fighting with this flickering issue the whole day!

1 Like

I also have the same issue. It’s annoying that still there’s no solution for it.

A solution that worked for me (not a workaround):

Basically I was running into a similar problem with the flicker. In my case, I was trying to use a “mouse enter” transition to navigate to a new frame to do a header nav colour change when my cursor entered a diff section. The flicker was because my scroll position was resetting during the transition and getting triggered over and over again in a continous loop as my cursor was entering a different trigger section after the scroll reset.

Here’s Figma’s documentation on this:

The old state management did not track your top level layer / frame name, therefore you could mouse-enter / mouse-leave and trigger a frame change to any frame with any naming convention and it would not glitch out (transition from a “Page-A” frame to a “Page-B” frame).

But now with the new state management rules, the flicker we have all been facing could likely be due to a layer name issue. In order to ensure that the flicker doesn’t happen by ensuring that the scroll position does not reset, you have to use the same name for your top level frame (e.g. both frames are called “Home”), or at the very least, they must share the same prefix (e.g. “Home/B” and “Home/B”).

Doing this instantly fixed the flicker for me and allowed me to do most of the complex prototyping actions under the old state management rules, hopefully it works for everyone else as well.

1 Like

Thank you!!

1 Like

Adding to this thought because I found the same “solution”. However, it doesn’t seem like it’s just about the mouse being on top of the overlay itself. It seems to be that the event is triggered with every (even slight) move of the mouse within a minuscule amount of time. The reason is that if I hover over my main navigation button (that triggers the overlay) and keep my mouse moving, I get the flicker, but if I ever so slightly move the mouse and get it to stop within [whatever that loop Figma has checking for mouse movement], I can get the overlay to stay open (or stay closed for that matter). That makes the moment of mouse transition into the overlay critical because that could be the moment it closes it, or the moment it opens its. Either way, it’s the overlay-triggering button causing the issue and that slight delay helps buffer that loop that’s checking for mouse movement. I can even add a delay as tiny as 1ms and it “fixes” it.

I should add to my last post just moments ago — if you add a dissolve to the overlay (as opposed to “instant”) it throws the whole “solution” out the window. The timing issue becomes unsurmountable. Really, really annoying.

Thanks for sharing it! It worked.