Make GUI follow Mouse Upon Entering Target Area

Currently I have a script that makes it so that when a mouse hovers over a certain model, it makes a frame visible and upon leaving the area, it makes it not visible. Is there a way to have it where the frame follows the mouse when its in the target area? Because so far the frame just pops up wherever I have it centered on the screen. I’ll drop my script below.

local Model = workspace.Hard.stage119["secret room"]["Noob picture"] 
local ClickDetector = Model.ClickDetector
local Frame = script.Parent

ClickDetector.MouseHoverEnter:Connect(function()
	Frame.Visible = true
	ClickDetector.MouseHoverLeave:Connect(function()
	Frame.Visible = false
	end)
end)

Thanks in advance!

1 Like

First off, you should not have your mouse leave event inside the mouse enter event. Every time a user hovers their mouse over your click detector, another event is made.

local Model = workspace.Hard.stage119["secret room"]["Noob picture"] 
local ClickDetector = Model.ClickDetector
local Frame = script.Parent

ClickDetector.MouseHoverEnter:Connect(function()
	Frame.Visible = true
end)
ClickDetector.MouseHoverLeave:Connect(function()
	Frame.Visible = false
end)

You could use a while loop or a RunServer.RenderStepped event to continuously set the position of your frame to be the Mouse.X and Mouse.Y. You can check out these two at: RunService | Roblox Creator Documentation and Mouse | Roblox Creator Documentation. You could also use UserInputService | Roblox Creator Documentation so the code only runs when a player moves their mouse. I hope this helps!

1 Like

So would I do something like this?:

local Model = workspace.Hard.stage119["secret room"]["Noob picture"] 
local ClickDetector = Model.ClickDetector
local Frame = script.Parent
local player = Players.LocalPlayer
local mouse = player:GetMouse()

local function onMouseMove()
    local position = Vector2.new(mouse.100, mouse.100)

ClickDetector.MouseHoverEnter:Connect(function()
	Frame.Visible = true
end)
ClickDetector.MouseHoverLeave:Connect(function()
	Frame.Visible = false
end)
end
mouse.Move:Connect(onMouseMove)

I’m not sure if that’s right or not, haha :sweat_smile: I’m still new with scripting so I do appreciate the help and direction!

You will want to keep your connections outside of this new function:

local Model = workspace.Hard.stage119["secret room"]["Noob picture"] 
local ClickDetector = Model.ClickDetector
local Frame = script.Parent
local player = Players.LocalPlayer
local mouse = player:GetMouse()
ClickDetector.MouseHoverEnter:Connect(function()
	Frame.Visible = true
end)
ClickDetector.MouseHoverLeave:Connect(function()
	Frame.Visible = false
end)
local function onMouseMove()
    local position = Vector2.new(mouse.100, mouse.100)
end
mouse.Move:Connect(onMouseMove)

You can get the mouse position by using mouse.X and mouse.Y. If you look at the UDim2 | Roblox Creator Documentation you will be using Offset. Scale is for a percentage of the screen while Offset is for pixels, which mouse.X and mouse.Y will provide. Set the position of Frame to be this new UDim2 and you should be all good to go!