Can someone help me with scripting this mouse hovering gui?

I have been looking on the dev forum and youtube for how to make this unique mouse hovering GUI but have found nothing so if anyone knows someone or how to do this plz reply I’m trying to open my new Homestore. :upside_down_face: https://gyazo.com/b29b7a77aa80cd7a197d65e32a5dcce0

1 Like

You’d use ui_object.MouseEnter:Connect(function() to fire if the user is hovering over it, use TweenService to create the movement (which you can also check if the player is close by checking .Magnitude) and fading of the shadow part (or you can use the for loop for the shadow), then you’re all set!

If you’re thinking of making a billboard like that, create a BillboardGui and ensure that it’s at the workspace - feel free to mess around until you get the right design you favour.

An example would be:

local ts = game:GetService("TweenService")
local billboard = game.Workspace:FindFirstChild("Billboard")
local plr = game.Players.LocalPlayer
local char = plr.Character or plr.CharacterAdded:Wait()
local hover = billboard:FindFirstChild("PART_TO_HOVER")
local shadow = billboard:FindFirstChild("YOUR_SHADOW_PART")
local scaleUi = ts:Create(billboard, TweenInfo.new(1, Enum.EasingStyle.Quart, Enum.EasingDirection.Out, 0, false, 0), {Size = UDim2.new(2, 2, 2, 2)})
local scaleUi2 = ts:Create(billboard, TweenInfo.new(1, Enum.EasingStyle.Quart, Enum.EasingDirection.Out, 0, false, 0), {Size = UDim2.new(0, 0, 0, 0)})
hover.MouseEnter:Connect(function()
    local applyShadowIn = ts:Create(shadow, TweenInfo.new(1, Enum.EasingStyle.Quart, Enum.EasingDirection.Out, 0, false, 0), {ImageTransparency = 0})
    local applyShadowOut = ts:Create(shadow, TweenInfo.new(1, Enum.EasingStyle.Quart, Enum.EasingDirection.Out, 0, false, 0), {ImageTransparency = 1})
    game:GetService("RunService").RenderStepped:Connect(function()
        local magnitude = (char:FindFirstChild("HumanoidRootPart").Position - billboard.Parent.Position)
        if magnitude <= 6 then
             scaleUi:Play()
             applyShadowIn:Play()
       else
            scaleUi2:Play()
            applyShadowOut:Play()
		end
	end)
end)
hover.MouseLeave:Connect(function()
      scaleUi2:Play()
      applyShadowOut:Play()
end)
---localscript in StarterPack

If you’re confused or anything isn’t working, let us know.

2 Likes