Fixing hover on a frame

the frame issue incident

just kidding

anyway, no more jokes(?)
the issue is this,


as you can see, for a second in the start you see
right in order.
selected, hovered, normal
but later on, you’ll see the third one just doesn’t even work, the 2nd is kinda broken and so is the first, the intended behaviour is something like this:

but it defintely isn’t anywhere there (yes yes i know… this illustration is INSANE!!!)
but anyway, here’s the code

local TweenService = game:GetService("TweenService")
local TweenInfo_ = TweenInfo.new(0.5, Enum.EasingStyle.Quint, Enum.EasingDirection.Out, 0, false, 0)

local Topbar = script.Parent
local one = Topbar.one
local two = Topbar.two
local three = Topbar.three

function Clicked(which)
	TweenService:Create(which, TweenInfo_, { BackgroundColor3 = Color3.fromRGB(52, 53, 58) , TextColor3 = Color3.fromRGB(255,255,255)}):Play()
end
function Selected(which)
	TweenService:Create(which, TweenInfo_, { BackgroundColor3 = Color3.fromRGB(45, 46, 50) , TextColor3 = Color3.fromRGB(225,225,225)}):Play()
end 
function Normal(which)
	TweenService:Create(which, TweenInfo_, { BackgroundColor3 = Color3.fromRGB(40, 41, 45) , TextColor3 = Color3.fromRGB(166,166,166)}):Play()
end

one.MouseButton1Click:Connect(function()
	Clicked(one)
	Normal(two)
	Normal(three)
end)

one.MouseEnter:Connect(function()
	Selected(one)
	Normal(three)
	Normal(two)
end)

one.MouseLeave:Connect(function()
	Normal(one)
	Normal(three)
	Normal(two)
end)

two.MouseButton1Click:Connect(function()
	Normal(one)
	Clicked(two)
	Normal(three)
end)

two.MouseEnter:Connect(function()
	Normal(one)
	Normal(three)
	Selected(two)
end)

two.MouseLeave:Connect(function()
	Normal(one)
	Normal(three)
	Normal(two)
end)

two.MouseButton1Click:Connect(function()
	Normal(one)
	Normal(two)
	Clicked(three)
end)

two.MouseEnter:Connect(function()
	Normal(one)
	Selected(three)
	Normal(two)
end)

three.MouseLeave:Connect(function()
	Normal(one)
	Normal(three)
	Normal(two)
end)

p.s. if someone could help me fix the mouseleave make everything normal BUT the currently selected it’d be gladly appreciated

thanks!

3 Likes

I cleaned up the code a bit and added functionality for the third button, tell me if this does any better and if there are any problems: (I renamed some of the functions because I believe you named them incorrectly)

--//Services
local TweenService = game:GetService("TweenService")

--//Variables
local Topbar = script.Parent

--//Controls
local TweenInfo_ = TweenInfo.new(0.5, Enum.EasingStyle.Quint, Enum.EasingDirection.Out, 0, false, 0)
local selectedButton = nil

--//Tables
local topbarButtons = {
	Topbar.one,
	Topbar.two,
	Topbar.three
}

--//Functions
local function Select(which)
	TweenService:Create(which, TweenInfo_, { BackgroundColor3 = Color3.fromRGB(52, 53, 58) , TextColor3 = Color3.fromRGB(255,255,255)}):Play()
end

local function Hover(which)
	TweenService:Create(which, TweenInfo_, { BackgroundColor3 = Color3.fromRGB(45, 46, 50) , TextColor3 = Color3.fromRGB(225,225,225)}):Play()
end 

local function Normal(which)
	TweenService:Create(which, TweenInfo_, { BackgroundColor3 = Color3.fromRGB(40, 41, 45) , TextColor3 = Color3.fromRGB(166,166,166)}):Play()
end

for i, topbarButton in ipairs(topbarButtons) do
	local otherButtons = {}

	for i, otherTopbarButton in ipairs(topbarButtons) do
		if otherTopbarButton == topbarButton then
			continue
		end

		table.insert(otherButtons, otherTopbarButton)
	end

	topbarButton.MouseButton1Click:Connect(function()
		selectedButton = topbarButton
		Select(topbarButton)

		for i, button in ipairs(otherButtons) do
			Normal(button)
		end
	end)

	topbarButton.MouseEnter:Connect(function()
		Hover(topbarButton)

		for i, button in ipairs(otherButtons) do
			Normal(button)
		end
	end)

	topbarButton.MouseLeave:Connect(function()
		for i, button in ipairs(topbarButtons) do
			if button == selectedButton then
				continue
			end
			
			Normal(button)
		end
	end)
end

I also did this in the script, I might have misunderstood it so please correct me if I’m wrong.

3 Likes

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.