MouseEnter not reliable on SurfaceGui?

Hey! So, I’m making a little “fancier” menu Interface. I’m using a SurfaceGui with ImageButtons and ImageLabels on it. Whenever I hover over these GUIObjects, they will move slightly to the right, and switch color.

This somewhat works, although, it is very unreliable on when it works.
Here’s a video example:https://www.youtube.com/watch?v=AJXU31KZjY8

I am using MouseEnter and MouseLeave event, which I have discovered are very unreliable. Although, why does it fire only a couple of times, decides to not care about the mouse for a couple of seconds, and then just work again?

Not only that, but I got a MouseButton1Click event hooked up with the button, although, it doesn’t work when the hover event doesn’t work. Does this mean that the SurfaceGui is not registering my mouse?

It’s the same problem when I start a server by pressing “Play” on the game page.

Here is the function that fires for every single button

local function moveTween(button)
	local MoveIncrement = 0.01
	local TweenDuration = 0.2
	local OriginalPosition = button.Position
	
	if button.Name == "NextChapter" or button.Name == "PreviousChapter" or button.Name == "EnterChapter" then
		button.MouseEnter:Connect(function()
			button.ImageColor3 = Color3.new(170, 0, 0)
		end)
		
		button.MouseLeave:Connect(function()
			button.ImageColor3 = Color3.new(255, 255, 255)
		end)
	else	
		button.MouseEnter:Connect(function()
			button.ImageColor3 = Color3.new(170, 0, 0)
			local newPos = UDim2.new(OriginalPosition.X.Scale + MoveIncrement, 0, OriginalPosition.Y.Scale, 0)
			button:TweenPosition(newPos, Enum.EasingDirection.Out, Enum.EasingStyle.Quad, TweenDuration, true)
		end)
	
		button.MouseLeave:Connect(function()
			button.ImageColor3 = Color3.new(255, 255, 255)
			button:TweenPosition(OriginalPosition, Enum.EasingDirection.Out, Enum.EasingStyle.Quad, TweenDuration, true)
		end)
	end
end

Thanks for dedicating time to help me!
If you’re in need of more information, please reply to this question!

  • Sethex aka. TheWaterFoox
3 Likes

Hmm. So you’re saying I should disconnect the hover events each time I press for example “Credits”, and reconnect when I press the “Back” button?

And because I got a function listening for MouseButton1Click on the same GUIObject, that might cause issues for the MouseEnter event?

Sorry about the first reply, i misunderstood what you meant by “function fired for every button”,

Disconnecting and reconnecting seems a bit inefficient, but according to the preview, the menu is fine “atleast” for the first menu selection, so doing a Reconnect seems to somewhat correct the issue,

I’m just assuming, but one of the reason why MouseLeave would glitch is because the player’s mouse is exiting the Instance in another way than the planned (x, y) Mouse move, and instead it’s the Camera that pull off the distance

That does actually make a little bit of sense. Even though, how come the MouseLeave event still fires and changes the text color back to white?

The other question is, why does it not work for an undecidable amount of seconds, and suddenly work again? Is it some kind of system roblox has invented that refreshes all the events to somewhat fix the issue? I don’t understand why it sometimes take 5 seconds for it to work again, and suddenly it takes 15 seconds? (As shown in video)

Thank you for the great responses by the way! :grin:

I went ahead and test the behavior for a bit
Idle

It seems the refresh is called everytime the mouse move, so the (x, y) values

But thinking of what you said, that makes a “unproper MouseLeave” possibility unvalid.
Engine Bug ?

Sometimes I have problems with MouseEnter and MouseLeave too, mostly when I make a drag&drop feature. The reason is usually a timing problem - the codes don’t have time to finish before a next one should start, or the object doesn’t move as fast as the mouse pointer. In your case I bet on the first one…

What I suggest for debugging: disable the tween object and change the color only or print an output and see if it works in this way or not.

In your video:

  • Back button seems always working on all sub-pages;
  • the “bug” occured when you came back from Settings page
  • there was no “bug” when you visited to “Credit” page
  • there was no “bug” when you started the program

Which of the above list is replicable?
Is there any other code e.g. in “Back” button(s)?

Well, that’s solved!
I forgot to mention a key part! :sweat_smile:
I can’t click the button, which is such a shame…
I got a regular MouseButton1Click event connected to the button, but it is just like the hovering event. It does not work for an undecidable amount of time. I’ll add that to the description of my problem. Hehe, sorry.

Here’s one thing I discovered not long ago:
I can’t click the button! That must mean that the GUIObject isn’t registering my mouse, right? Why is it like that I wonder.

I’ll try to replicate what you listed above. (:

MouseButton1Click can also be set as a variable and use :Disconnect()
so i guess you’ll have to make it jump into the reconnecting train.

I guess so. I’ll give it a try (:

Disconnecting and reconnecting does unfortunately not work.
I think it has something to do with the GUIObjects not being able to read the mouse.
¯_(ツ)_/¯

Thanks anyways! ^^

Here’s the code for the backButtons

for i, element in pairs(gui:GetDescendants()) do
        if element:IsA("ImageButton") and element.Name == "BackButton" then
	        element.MouseButton1Click:Connect(function()
		        CurrentCamera.CameraSubject = game.Workspace.Menu.MainMenu.MenuCamera
                end)
        end

        if element:IsA("ImageButton") then
		moveTween(element) --Fires the tweening function in my post for every ImageButton
	end
end
  • I was able to get the bug when I visited the “Credit” page
  • Back button always works. It never broke out of all the times I tested this out. (About 30 times)
  • I was not able to replicate the bug when ever I started the program, but staying at the page, hovering back and forth over the buttons eventually (about 20 seconds of quick hovering, although, sometimes 10 and other times 1 minute)

A though of mine is that the camera position is doing something. I am Interpolating my camera to move randomly around. When it reaches a certain position, that might be when the bug occurs.

Quick Update:

Hooray! After fiddeling around with this problem for four hours, I finally found the solution! It was actually the camera positioning that was the problem! I got parts in the workspace I have named “Camera” which are the parts that the camera randomly moves around for each “screen”. I copied the camera part that the “Credit” window had and used the same rotation, and the same y and z position for it. Turned out with the bug disappearing! The original part I had, was slightly repositioned, which is why I thought of the camera being the problem!

Thanks to all the amazing people who helped me out with this problem!

– Sethex aka. TheWaterFoox

1 Like