How would I fix the highlight on my GUI?

I’m having trouble making the ImageLabels only appearing one at a time. How would I fix this?

Screenshot 2024-09-27 174802

script.Parent.ImageTransparency = 1

local hovering = false

script.Parent.MouseEnter:Connect(function()
	hovering = true
	wait(.1)
	if hovering then
		game:GetService("TweenService"):Create(script.Parent, TweenInfo.new(0.25), {ImageTransparency = 0}):Play()
	end
end)

script.Parent.MouseLeave:Connect(function()
	hovering = false
	script.Parent.ImageTransparency = 1
end)

The tween will keep playing and setting the transparency unless it’s cancelled. That’s why the transparency can’t be changed by setting the property while the tween is playing.

One way to stop a tween is to start another one: Tween | Documentation - Roblox Creator Hub

If two tweens attempt to modify the same property, the initial tween is cancelled and overwritten by the most recent tween . . .

So instead of setting the transparency with the line script.Parent.ImageTransparency = 1, you could instead start a new tween which will hide the ImageLabel.

instead of making a hover script for each button, you should make one script that just gets all the buttons
also use TweenService like what @6mikael6 said

local TS = game:GetService("TweenService")
local tInfo = TweenInfo.new(0.25, Enum.EasingStyle.Quint, Enum.EasingDirection.Out) -- Not sure if i did this right

local Menu = script.Parent

for _, ButtonHolder in Menu:GetChildren() do -- Loop through the list
  local Button = ButtonHolder:FindFirstChild("TextButton")
  if not Button or not Button:IsA("GuiButton") then continue end -- Make sure the element is a button
  
  Button.MouseEnter:Connect(function()
    TS:Create(Button, tInfo, {["BackgroundTransparency"] = 0}):Play()
  end)

  Button.MouseLeave:Connect(function()
    TS:Create(Button, tInfo, {["BackgroundTransparency"] = 1}):Play()
  end)
end

i’m assuming your original script isn’t working properly because of the wait before the hover check

1 Like