Web前端-html页面-网易注册表单，美化及时验证效果

今天研究了网易用户注册的表单，以及其及时验证，本真人不得不说无论是它的布局结构还是其风骚的“弹出式加载验证”都是让人眼前一亮，居然还可以这样玩！…

html代码：

<!--logo位置-->
<div id="header"><img src="img/register_logo.png" alt="logo"/></div>
<div id="main">
<table width="100%" border="0" cellpadding="0"  cellspacing="0">
<!--看不见的第一行-->
<tr>
    <td class="bg bg_top_left"></td>
    <td class="bg_top"></td>
    <td class="bg bg_top_right"></td>
</tr>
<!--看得见的第二行-->
<tr>
    <td class="bg_left"></td>
    <td class="content">
    <!--表单提交，因本真人是解析来着，算不出网易服务器地址，就不详细介绍了-->
    <form action="" method="post" name="myform" onsubmit="return checkForm()">
        <!--居然采用自定义列表，嘿嘿-->
        <dl>
            <dt>通行证用户名：</dt>
            <dd><input type="text" id="userName" class="inputs userWidth" onfocus="userNameFocus()" onblur="userNameBlur()"/>@163.com</dd>
            <div id="userNameId"></div><!--这里当做提示框！-->
        </dl>

        <dl>
            <dt>登录密码：</dt>
            <dd><input type="password" id="pwd" class="inputs" onfocus="pwdFocus()" onblur="pwdBlur()"/></dd>
            <div id="pwdId"></div>
        </dl>

        <dl>
            <dt>重复登录密码：</dt><!--这里只有onblur:用户使用逻辑使然-->
            <dd><input type="password" id="repwd" class="inputs" onblur="repwdBlur()"/></dd>
            <div id="repwdId"></div>
        </dl>

        <dl>
            <dt>性别：</dt><!--性别这里居然不给设置验证，就一个默认，本真人有点不服-->
            <dd><input type="radio" name="sex" value="男" checked="checked"/>男
                <input type="radio" name="sex" value="女" />女
            </dd>                           
        </dl>

        <dl>
            <dt>真实姓名：</