xSpan

function initCss(e, o, span) {
    var display = $(o).val().length == 0 || e.type === "blur" ? "none" : "inline" ;
    span.css({ "display": display, "position": "absolute", "cursor": "default", "margin-left": -25, "top": 3 });
}
function inOut(e,fo, el, span, textAlign, num) {
    if (fo.length > 0) {
        fo.each(function (i, e) { $(el).css("background-color", "rgba(255, 255, 255,0)") });
    }
    else
        $(el).css({ "text-align": textAlign, "background-color": "rgba(255, 255, " + num + ",1)" });

    initCss(e,el, span);
    //span.css("display", "none");
}

$(function () {
    $(":text:visible").not("input.textbox_date").each(function (i, e) {
        let loginForm = $('form[id="loginForm"] dl input[type="text"]');
        let textAlign = $(this).css("text-align");
        let fontColor = [[0, 0, 0], [255, 255, 255]];
        let fontSize = ["medium", "xx-large"];
        let xSpan = $("#xSpan_" + this.id);
        let val = $(this);

        $(this).keyup(function (e) {
            initCss(e,this, $(xSpan.selector));
        });

        $(this).focus(function (e) {
            inOut(e,loginForm, this, $(xSpan.selector), textAlign, 221);

            if ($(xSpan.selector).length == 0) {
                $(this).after('<span id="' + xSpan.selector.substring(1) + '" class="span-clear-x">&times;</span>');
            }
            $(xSpan.selector).mousedown(function () { val.val(''); });
            initCss(e, this, $(xSpan.selector));
        });
        $(this).blur(function (e) {
            inOut(e,loginForm, this, $(xSpan.selector), textAlign, 255);
        });
    });

});