CodingForum Registration Page username inline validation - how is that done?

[milesdriven]

I like the rectangular box that appears below the username field after each keystroke ( onkeyup, I think ) to give the registering user a message about the username being typed in.

How is the rectangular colored box effect done?

How is the green check mark done?

[sunfighter]

where is this located?

[milesdriven]

It is done on the username field of the registration page for this forum, as you type in your new username as part of registration. You have to step through the first couple of steps of the registration process, without completing it, to get to the place where this affect occurs.

You have to agree to the rules, then start typing in a username. The script that runs behind the username field creates this effect.

I recently registered for the first time and watched the effect. I went through the first couple of steps again to take a closer look at how the effect happened. I didn't register again. I backed out the second time.

I like it because it creates a long rectangular box immediately below the username field that contains a message specific to each keystroke as you type, and is very easy to see as you type in your username.

The box is "colored in" with a color that fits the tone of each message that pops up as you type each character of your username, and its location makes it easy to see.