TweenMax实现带动画过渡效果的注册表单代码

代码语言:html

所属分类:表单美化

代码描述:TweenMax实现带动画过渡效果的注册表单代码

代码标签: TweenMax 动画 过渡 注册 表单

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css">
    <style>
        body {
	width:100%;
	position:relative;
	background:#d7427d;
	font-family:helvetica
}
.input-group {
	padding:10px 40px;
	height:25px;
	transform:translateY(-10px) scale(0.7);
	transition:all ease .3s;
	opacity:0
}
.input-group.first {
	margin-top:-20px
}
.input-group.open {
	transform:translateY(0px) scale(1);
	opacity:1
}
.input-group label {
	display:block;
	font-family:"Helvetica";
	letter-spacing:1px;
	color:#b3b3b3;
	font-size:12px;
	transform:translateY(-22px);
	transition:all ease .3s
}
.input-group input {
	display:block;
	width:100%;
	border:0;
	border-bottom:1px solid #eee;
	outline:0;
	line-height:20px;
	font-family:"Helvetica";
	letter-spacing:1px
}
.input-group input:focus ~ .........完整代码请登录后点击上方下载按钮下载查看

网友评论0