:TweenSize not working properly

Help and Feedback Scripting Support
1

Im making an inventory button and made it tween in size when you hover over it, my issue is, is when you hover over it the animation almost repeats itself

and heres the script

script.Parent.MouseEnter:Connect(function()
	script.Parent:TweenSize(UDim2.new(0.248, 0,0.063, 0),Enum.EasingDirection.InOut,Enum.EasingStyle.Back,1)
	game:GetService('TweenService'):Create(script.Parent.ImageLabel,TweenInfo.new(1,Enum.EasingStyle.Back,Enum.EasingDirection.InOut),{Rotation = 20}):Play()
end)

script.Parent.MouseLeave:Connect(function()
	script.Parent:TweenSize(UDim2.new(0.186, 0,0.063, 0),Enum.EasingDirection.InOut,Enum.EasingStyle.Back,1)
	game:GetService('TweenService'):Create(script.Parent.ImageLabel,TweenInfo.new(1,Enum.EasingStyle.Back,Enum.EasingDirection.InOut),{Rotation = 0}):Play()
end)
3

Its because your easing direction is inout which means it plays the animation at both the end and the beginning which doesn’t look good. Change it to in or out. Out if u want it to do the animation at the end. In if your want it to do the animation in the beginning

4

Use easing direction in when focused and out when not focused.