Input animation

read-only color fade

by arcm111

HTML

<form name="formex">
	<input type="text" name="numberinput"/>
</form>

CSS

.hang
{
	transition: all 4s;
	background-color: red;
}

JavaScript

document.formex.numberinput.onchange = function()
{
    if (isNaN (parseInt (this.value)))
	{
		console.log ('not number');
        this.className = "hang";
        this.setAttribute ('readonly', true);
		setTimeout (function (elm)
		{
        	elm.removeAttribute ('readonly');
			elm.className = "";
        	elm.value = "";
			elm.focus();
		}, 4000, this);
    }
}