<form name="login" action="#" method="post">   
    <div id="username">    
    <label for="username-field" class="overlabel">Имя пользователя...</label>   
    <input id="username-field" type="text" name="username" title="Username" value="" tabindex="1" />   
    </div>   
    <div id="password">   
    <label for="password-field" class="overlabel">Пароль...</label>   
    <input id="password-field" type="password" name="password" title="Password" value="" tabindex="2" />   
    </div>   
    <div id="submit">   
    <input type="submit" name="submit" value="Войти" tabindex="3" />   
    </div>   
</form>

<style type="text/css">   
form#login {    
position:relative;   
}   
div#username,   
div#password {    
position:relative;    
float:left;    
margin-right:3px;   
}   
input#username-field,   
input#password-field {    
width:10em;   
}   
label.overlabel {    
position:absolute;    
top:3px;    
left:5px;    
z-index:1;    
color:#999;   
}    
label.overlabel {    
color:#999;    
}    
label.overlabel-apply {    
position:absolute;    
top:3px;    
left:5px;    
z-index:1;    
color:#999;    
font-family: Verdana;    
font-size: 11px;    
}   
</style>

<script type="text/javascript">   
    function initOverLabels () {   
    if (!document.getElementById) return;    
    var labels, id, field;   
    labels = document.getElementsByTagName('label');   
    for (var i = 0; i < labels.length; i++) {   
    if (labels[i].className == 'overlabel') {   
    id = labels[i].htmlFor || labels[i].getAttribute('for');   
    if (!id || !(field = document.getElementById(id))) {   
    continue;   
    }    
    labels[i].className = 'overlabel-apply';   
    if (field.value !== '') {   
    hideLabel(field.getAttribute('id'), true);   
    }   
    field.onfocus = function () {   
    hideLabel(this.getAttribute('id'), true);   
    };   
    field.onblur = function () {   
    if (this.value === '') {   
    hideLabel(this.getAttribute('id'), false);   
    }   
    };   
    labels[i].onclick = function () {   
    var id, field;   
    id = this.getAttribute('for');   
    if (id && (field = document.getElementById(id))) {   
    field.focus();   
    }   
    };   
    }   
    }   
    };   
function hideLabel (field_id, hide) {   
    var field_for;   
    var labels = document.getElementsByTagName('label');   
    for (var i = 0; i < labels.length; i++) {   
    field_for = labels[i].htmlFor || labels[i].getAttribute('for');   
    if (field_for == field_id) {   
    labels[i].style.textIndent = (hide) ? '-1000px' : '0px';   
    return true;   
    }   
    }   
    }   
window.onload = function () {   
    setTimeout(initOverLabels, 50);   
    };   
    </script>