How can I make this gui scale smoothly?

I am making a GUI that has three different menus. When you first open the gui, you are prompted to select a menu. For effect, I want all three "menu openers" to expand to half the size of the full gui while the others shrink to a quarter of the full gui (they all start at one third because there are three). The only problem is, if you move your cursor off the gui too soon, the menu opener buttons get stuck in place temporarily. It doesn't ruin the functionality, but it looks unprofessional. Are there any ways I can fix this? All help is appreciated.

Here is the script I have currently (below). It only operates when highlighting one of the menu openers, but I will make similar scripts for the other openers (or modify this one to accommodate all three) based on the answers I receive.

local player = game.Players.LocalPlayer
local mouse = player:GetMouse()

local FocusGUI = script.Parent -- Menu opener being enlarged
local GUI2 = script.Parent.Parent.CharacterScripts -- Menu opener being shrunk (1)
local GUI3 = script.Parent.Parent.ServerControl -- Menu opener being shrunk (2)
local Sep1 = script.Parent.Parent.Seperator1 -- Border 1
local Sep2 = script.Parent.Parent.Seperator2 -- Border 2

local hasBeenDone = false

FocusGUI.MouseEnter:Connect(function() -- This function moves the menu openers to their NEW positions.
	if hasBeenDone == false then
		hasBeenDone = true
		FocusGUI:TweenSize(UDim2.new(0,350,0,350))
		GUI2:TweenSize(UDim2.new(0,175,0,350))
		GUI2:TweenPosition(UDim2.new(0.25,0,0,0))
		Sep1:TweenPosition(UDim2.new(0.25,0,0,0))
		GUI3:TweenSize(UDim2.new(0,175,0,350))
		GUI3:TweenPosition(UDim2.new(0.375,0,0,0))
		Sep2:TweenPosition(UDim2.new(0.375,0,0,0))
	end
end)

FocusGUI.MouseLeave:Connect(function() -- This function moves the menu openers to their ORIGINAL positions.
	if hasBeenDone == true then
		hasBeenDone = false
		FocusGUI:TweenSize(UDim2.new(0,233,0,350))
		GUI2:TweenSize(UDim2.new(0,234,0,350))
		GUI2:TweenPosition(UDim2.new(0.167,0,0,0))
		Sep1:TweenPosition(UDim2.new(0.167,0,0,0))
		GUI3:TweenSize(UDim2.new(0,233,0,350))
		GUI3:TweenPosition(UDim2.new(0.334,0,0,0))
		Sep2:TweenPosition(UDim2.new(0.334,0,0,0))
	end
end)

Here is a version I made using SmartNode's Hover module script:

local FocusGUI = script.Parent
local GUI2 = script.Parent.Parent.CharacterScripts
local GUI3 = script.Parent.Parent.ServerControl
local Sep1 = script.Parent.Parent.Seperator1
local Sep2 = script.Parent.Parent.Seperator2

local hasBeenDone = false

local ME, ML = require(script.Hover)(script.Parent)

ME:Connect(function()
	FocusGUI:TweenSize(UDim2.new(0,350,0,350))
	GUI2:TweenSize(UDim2.new(0,175,0,350))
	GUI2:TweenPosition(UDim2.new(0.25,0,0,0))
	Sep1:TweenPosition(UDim2.new(0.25,0,0,0))
	GUI3:TweenSize(UDim2.new(0,175,0,350))
	GUI3:TweenPosition(UDim2.new(0.375,0,0,0))
	Sep2:TweenPosition(UDim2.new(0.375,0,0,0))
end)

ML:Connect(function()
	FocusGUI:TweenSize(UDim2.new(0,233,0,350))
	GUI2:TweenSize(UDim2.new(0,234,0,350))
	GUI2:TweenPosition(UDim2.new(0.167,0,0,0))
	Sep1:TweenPosition(UDim2.new(0.167,0,0,0))
	GUI3:TweenSize(UDim2.new(0,233,0,350))
	GUI3:TweenPosition(UDim2.new(0.334,0,0,0))
	Sep2:TweenPosition(UDim2.new(0.334,0,0,0))
end)

Most developers aren't aware of the bugs that ROBLOX doesn't seem to care about.

For example, the default MouseEnter and MouseLeave work at a minimum- they're buggy and you will not see them in many popular games if you ever find an uncopylocked version.

I have a custom MouseEnter and MouseLeave module from @madattak that I updated so that it fits my satisfaction. However, this will not work with rotated objects.

Feel free to take it, instructions and examples are included.

NodeUI