邮箱输入辅助插件 EmailPop

在讲解开始之前,你可能希望先查看:demo download

当用户使用邮箱登录你网站时,你可能希望免去用户一些输入,以及防止用户写错邮箱地址,类似于新浪微博登录时的提示:

emailpop

首先需要定义它的html结构,这决定了它的显示方式及运行原理,我使用了一个无序列表“UL”:

1
2
3
4
5
6
<ul id="emailpop" class="autopop">
	<li class="notpop">请选择邮箱类型</li>
	<li class="pop">yu123</li>
	<li>yu123@gmail.com</li>
	<li>yu123@sina.com</li>
</ul>

基本结构固定好以后,由于选择表现与逻辑分离,需要给它定义样式:

继续阅读全文