-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathindex0.html
124 lines (115 loc) · 5.22 KB
/
index0.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
<!DOCTYPE html>
<html lang="zxx">
<head>
<title>sign in/sign up form</title>
<!-- Meta-Tags -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta charset="utf-8">
<meta name="keywords" content="Quick Signin & Signup form a Responsive Web Template, Bootstrap Web Templates, Flat Web Templates, Android Compatible Web Template, Smartphone Compatible Web Template, Free Webdesigns for Nokia, Samsung, LG, Sony Ericsson, Motorola Web Design">
<script>
addEventListener("load", function () {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<!-- //Meta-Tags -->
<!-- Index-Page-CSS -->
<link rel="stylesheet" href="css/styles.css" type="text/css" media="all">
<!-- onlinefonts -->
<link href="//fonts.googleapis.com/css?family=Dosis:200,300,400,500,600,700,800" rel="stylesheet">
<!-- //Custom-Stylesheet-Links -->
</head>
<body>
<header>
<h1 class="title-agile text-center"> SIGN UP FORM</h1>
</header>
<!-- //header -->
<section class="login-wrap">
<div class="main_w3agile">
<input id="tab-2" type="radio" name="tab" class="sign-up">
<label for="tab-2" class="tab">Sign Up</label>
<div class="login-form">
<!-- signin form -->
<div class="signin_wthree">
<form method="post" action="#">
<div class="group">
<label for="user" class="label">Username</label>
<input id="user" type="text" class="input" required>
</div>
<div class="group">
<label for="pass" class="label">Password</label>
<input id="pass" type="password" class="input" data-type="password" required>
</div>
<div class="group">
<input id="check" type="checkbox" class="check" checked>
<label for="check">
<span class="icon"></span> Keep me Signed in</label>
</div>
<div class="group">
<input type="submit" class="button" value="Sign up">
</div>
<div class="hr"></div>
<div class="foot-lnk">
<h2><a href="#">Forgot Password?</a></h2>
</div>
</form>
</div>
<!-- //signin form -->
<!-- signup form -->
<div class="signup_wthree">
<form method="post" action="#">
<div class="group">
<label for="user1" class="label">Username</label>
<input id="user1" type="text" class="input" required>
</div>
<div class="group">
<label for="password1" class="label">Password</label>
<input id="password1" type="password" class="input" data-type="password" required>
</div>
<div class="group">
<label for="password2" class="label">Re-Enter Password</label>
<input id="password2" type="password" class="input" data-type="password" required>
</div>
<div class="group">
<label for="email" class="label">Email Address</label>
<input id="email" type="email" class="input" required>
</div>
<div class="group">
<input type="submit" class="button" value="Sign Up">
</div>
<div class="hr"></div>
<div class="foot-lnk">
</div>
</form>
</div>
<!-- //signup form -->
</div>
</div>
</section>
<!-- //section -->
<footer>
</div>
</footer>
<!-- //footer -->
<!-- script for password match -->
<script>
window.onload = function () {
document.getElementById("password1").onchange = validatePassword;
document.getElementById("password2").onchange = validatePassword;
}
function validatePassword() {
var pass2 = document.getElementById("password2").value;
var pass1 = document.getElementById("password1").value;
if (pass1 != pass2)
document.getElementById("password2").setCustomValidity("Passwords Don't Match");
else
document.getElementById("password2").setCustomValidity('');
//empty string means no validation error
}
</script>
<!-- script for password match -->
</body>
<!-- //Body -->
</html>