daily pastebin goal
10%
SHARE
TWEET

Untitled

a guest Oct 12th, 2017 107 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <html>
  3.         <head>
  4.              <meta charset="UTF-8"/>
  5.             <title>login</title>
  6.             <link rel="stylesheet" type="text/css" href="css/style.css"/>
  7.             <script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
  8.         </head>
  9.     <body>
  10.         <div id="container">
  11.             <div class="loginbutton">
  12.                     <p>Login</p>
  13.             </div>
  14.             <div class="login_extended">
  15.                 <div class="login">
  16.                     <form>
  17.                             <div class="naamform">TINKR SIGN IN</div>
  18.                             <input type="text" name="email" placeholder="E-mail"/> <br />
  19.                             <input type="text" name="password" placeholder="Password"/><br />
  20.                             <button value="Login" class="marginbutton"> Login </button><br />
  21.                             <a href="#" class="formlink">Forgot password?</a>
  22.                     </form>
  23.                 </div>
  24.                             <hr/>
  25.                             <div class="create">Create Account</div>
  26.                     <div class="register">
  27.                         <form>
  28.                             <p class="naamform">Register</p>
  29.                                 <input placeholder= "First name"/>
  30.                                 <input placeholder= "Last name"/>
  31.                                 <input placeholder= "E-mail"/>
  32.                                 <input placeholder= "Password"/>
  33.                                 <input placeholder= "Confirm Password"/>
  34.                                 <input type="submit" value="register">
  35.                         </form>
  36.                     </div>
  37.             </div>
  38.         </div>
  39.         <script type="text/javascript">
  40.            
  41.             $(document).ready(function(){
  42.                 $('.login_extended').hide(1);
  43.                 $('.register').hide(0);
  44.  
  45.                 $('.loginbutton').click(function(){
  46.                     $('.login_extended').show();
  47.  
  48.                 });
  49.                 $('.create').click(function(){
  50.                     $('.register').show();
  51.                     $('.login').hide(0);
  52.                 });    
  53.             })
  54. $(document).mouseup(function(e)
  55. {
  56.     var loginScherm = $(".login_extended");
  57.     if (!loginScherm.is(e.target) && loginScherm.has(e.target).length === 0)
  58.     {
  59.         loginScherm.hide();
  60.     }
  61. });
  62.         </script>
  63.     </body>
  64. </html>
RAW Paste Data
Top