Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 37 views

    Activity: Bootstrap Login Form in Modal Name: Joaquim Muhongo Subject: Human Interaction Computer

    Uploaded by

    Masha Rosa
    The document describes a Bootstrap login form implemented within a modal popup window. It includes the HTML, CSS, and JavaScript code to create the login form with fields for email and password. The modal contains a header, body for the form, and footer with submit and forgot password/register links. A button is also included to trigger opening the modal login form.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd

    Activity: Bootstrap Login Form in Modal Name: Joaquim Muhongo Subject: Human Interaction Computer

    Uploaded by

    Masha Rosa
    37 views4 pages
    The document describes a Bootstrap login form implemented within a modal popup window. It includes the HTML, CSS, and JavaScript code to create the login form with fields for email and password. The modal contains a header, body for the form, and footer with submit and forgot password/register links. A button is also included to trigger opening the modal login form.

    Original Description:

    login

    Original Title

    Login

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    The document describes a Bootstrap login form implemented within a modal popup window. It includes the HTML, CSS, and JavaScript code to create the login form with fields for email and password. The modal contains a header, body for the form, and footer with submit and forgot password/register links. A button is also included to trigger opening the modal login form.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    37 views4 pages

    Activity: Bootstrap Login Form in Modal Name: Joaquim Muhongo Subject: Human Interaction Computer

    Uploaded by

    Masha Rosa
    The document describes a Bootstrap login form implemented within a modal popup window. It includes the HTML, CSS, and JavaScript code to create the login form with fields for email and password. The modal contains a header, body for the form, and footer with submit and forgot password/register links. A button is also included to trigger opening the modal login form.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    of 4

    Activity : Bootstrap Login Form in Modal

    Name : Joaquim Muhongo


    Subject : Human Interaction Computer

    Code
    <html>
    <head>
    <title>Bootstrap Login Form in Modal</title>
    <link rel="stylesheet"
    href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
    <script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script
    >
    <!-- Latest compiled and minified JavaScript -->
    <script
    src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></sc
    ript>
    <style>
    /* custom css style starts here */
    .login-header{
    background: #880e4f;
    color:#fff;
    }

    </style>
    </head>
    <body>
    <!----modal starts here--->
    <div id="tutorialsplaneModal" class="modal fade" role='dialog'>
    <div class="modal-dialog modal-sm">
    <div class="modal-content">
    <div class="modal-header login-header">
    <button type="button" class="btn btn-primary" data-dismiss="modal"
    aria-hidden="true">X</button>
    <h4 class="modal-title">Login</h4>
    </div>
    <div class="modal-body">
    <!---login form starts here-->
    <form role="form">
    <div class="form-group">
    <label for="email">Email</label>
    <input type="text" name= "email" class="form-control"
    id="email"
    placeholder="Enter Email">
    </div>
    <div class="form-group">
    <label for="password">Password</label>
    <input type="password" name="password" class="form-
    control" id="password"
    placeholder="Enter Password">
    </div>
    </form>

    </div>
    <div class="modal-footer">
    <button type="button" class="btn btn-primary" data-
    dismiss="modal">Sign In</button>
    <div class="row">
    <div class="col-xs-7 col-sm-7 col-md-7">
    <a href="#" class="btn btn-link">Forgot Password?</a>
    </div>
    <div class="col-xs-4 col-sm-4 col-md-4">
    <a href="#" class="btn btn-link">Register</a>
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    <!--Modal ends here--->
    <!----add button to trigger the modal---->
    <button type="button" class="btn btn-primary" data-toggle="modal" data-
    target="#tutorialsplaneModal">
    Modal Login
    </button>

    </body>
    </html>

    Output

    You might also like