登录窗口在我们日常使用应用或者打开网站时都会碰到，已经屡见不鲜，今天浏览网页的时候，看到一个登录窗口，感觉动效还挺好的，就用Axure做了一个原型，供大家参考学习。

效果描述

1、Email获取焦点时，提示文案“Email”变小上移，同时下划线变色显示待输入状态；失去焦点时，无输入则返回默认状态，有输入则只有下划线回到默认状态，Code输入同理。

2、拖动滑块进行验证，没拖到最右边，拖动结束时弹回原位置；拖到最右边，拖动结束时显示验证成功！

原型演示链接：http://jabzj8.axshare.com

元件准备

Email输入框：“Email”文本+无边框文本框+下划线（Code同理）

滑动验证：滑块动态面板+底层滑道

登录按钮：登录按钮

命名：“Email”文本命名“hint”；无边框文本命名“input”；滑动动态面板命名为“slider”；底层滑动命名为“slider frame”；登录按钮命名为“button”。

添加用例