local sx, sy = guiGetScreenSize();
local ch = {};

showCursor(true);

for i=1,3 do
    ch['x'..i] = sx;
    ch['alpha'..i] = 50;
end

local function showAnimation()
    local elapsedTime = getTickCount() - ch.startTime;
    local progress = elapsedTime / 500;

    ch['x'..ch.id], ch['alpha'..ch.id], _ = interpolateBetween(ch['x'..ch.id], ch['alpha'..ch.id], 0,
        sx - 300, 200, 0,
        progress, 'InOutQuad');

    if progress >= 1 then
        removeEventHandler('onClientRender', root, showAnimation);
    end
end

local function hideAnimation()
    local elapsedTime = getTickCount() - ch.startTime;
    local progress = elapsedTime / 500;

    ch['x'..ch.id], ch['alpha'..ch.id], _ = interpolateBetween(ch['x'..ch.id], ch['alpha'..ch.id], 0,
        sx, 50, 0,
        progress, 'InOutQuad');

    if progress >= 1 then
        removeEventHandler('onClientRender', root, hideAnimation);
    end
end

ch[1] = guiCreateLabel(sx - 300, sy / 2 - 200, 300, 100, '', false);
ch[2] = guiCreateLabel(sx - 300, sy / 2 - 50, 300, 100, '', false);
ch[3] = guiCreateLabel(sx - 300, sy / 2 + 100, 300, 100, '', false);

local function drawRectangles()
    dxDrawRectangle(sx - 300, sy / 2 - 200, 300, 100, tocolor(0, 0, 0, 100));
    dxDrawRectangle(sx - 300, sy / 2 - 50, 300, 100, tocolor(0, 0, 0, 100));
    dxDrawRectangle(sx - 300, sy / 2 + 100, 300, 100, tocolor(0, 0, 0, 100));

    dxDrawRectangle(ch.x1, sy / 2 - 200, sx - ch.x1, 100, tocolor(0, 0, 0, ch.alpha1));
    dxDrawRectangle(ch.x2, sy / 2 - 50, sx - ch.x2, 100, tocolor(0, 0, 0, ch.alpha2));
    dxDrawRectangle(ch.x3, sy / 2 + 100, sx - ch.x3, 100, tocolor(0, 0, 0, ch.alpha3));
end

addEventHandler('onClientRender', root, drawRectangles)

addEventHandler('onClientMouseEnter', root, function()
    ch.startTime = getTickCount();
    if source == ch[1] then
        ch.id = 1;
        addEventHandler('onClientRender', root, showAnimation);
    end

    if source == ch[2] then
        ch.id = 2;
        addEventHandler('onClientRender', root, showAnimation);
    end

    if source == ch[3] then
        ch.id = 3;
        addEventHandler('onClientRender', root, showAnimation);
    end
end)

addEventHandler('onClientMouseLeave', root, function()
    ch.startTime = getTickCount();
    if source == ch[1] then
        ch.id = 1;
        addEventHandler('onClientRender', root, hideAnimation);
    end

    if source == ch[2] then
        ch.id = 2;
        addEventHandler('onClientRender', root, hideAnimation);
    end

    if source == ch[3] then
        ch.id = 3;
        addEventHandler('onClientRender', root, hideAnimation);
    end
end)