I've created two form fields (username, password).
When a user comes to the page, the word "Username" is shown in the first form field. The word "Password" is shown in the second field. When a user clicks inside the field, the word inside the field erases automatically, allowing them to type in their username.
Everything above is working, except I'm running into some problems.
I need to figure out a way to include an if statement, that displays "Username" once again, if they did not type anything in the username field, and they clicked outside of the field. This will be the case for the Password field as well.
If a user types in their username in the username field, then types in their password, but clicks on the Username field once again to fix a typo, it completely erases their username from the field, making them have to type it all again.
I've included my code below. Thanks!
Any help appreciated
background:url(../img/loginbox.gif) no-repeat bottom;
padding: 2px 7px 0px 7px;
font-family:Verdana, Arial, Helvetica, sans-serif;
<form name="login" action="template.html" method="POST">
<div class="loginboxdiv" id="username">
<input type="text" class="loginbox" name="username" value="Username" onclick="make_blank();">
<div class="loginboxdiv" id="password">
<input class="loginbox" name="password" type="text" value="Password" onclick="make_blank1();">