html code:
<!-- login start --> <div class="modal fade in" id="login" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="false"> <div class="modal-dialog" style="max-width:450px;"> <div class="popup signin"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">close</span></button> <h3>sign in hero pet</h3> <p class="two-buttons clearfix"> <a href="#" data-toggle="modal" data-target="#register" data-backdrop="static" data-keyboard="false" id="closelogin" data-dismiss="modal"> <img src="<?php echo base_url();?>frontend/images/signup_grey.png" alt=""> </a> <a href="#"> <img src="<?php echo base_url();?>frontend/images/signin_green.png" alt=""> </a> </p> <form method="post" id="login-form" > <div class="field"> <input type="text" class="textbox" placeholder="email address"> </div> <div class="field"> <input type="password" class="textbox" placeholder="password"> </div> <div class="field"> <label><a href="#" data-toggle="modal" data-target="#lostpassword" data-backdrop="static" data-keyboard="false" id="closelogin" data-dismiss="modal"> lost password?</a></label> </div> <div class="field"> <label> <input type="checkbox" name="autologin" value="1"> remember me</label> </div> <div class="field"> <button type="submit" class="submit" name="userlogin"><img src="<?php echo base_url();?>frontend/images/login-button.png"></button> </div> </form> </div> </div> </div> <!-- login end --> i didn't know why happening can please me how resolve error? in advance , sorry weak english. tried many option failed in option.
modals intended not display default. need open modal calling data-target correlates modal div id:
<button type="button" data-toggle="modal" data-target="#login">open login modal</button> i've created bootply showcasing here.
also note modal missing containing div <div class="modal-content"> inside of <div class="modal-dialog">. i've corrected in following example:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <!-- login start --> <div class="modal fade in" id="login" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="false"> <div class="modal-dialog" style="max-width:450px;"> <div class="modal-content"> <div class="popup signin"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">close</span></button> <h3>sign in hero pet</h3> <p class="two-buttons clearfix"> <a href="#" data-toggle="modal" data-target="#register" data-backdrop="static" data-keyboard="false" id="closelogin" data-dismiss="modal"> <img src="<?php echo base_url();?>frontend/images/signup_grey.png" alt=""> </a> <a href="#"> <img src="<?php echo base_url();?>frontend/images/signin_green.png" alt=""> </a> </p> <form method="post" id="login-form"> <div class="field"> <input type="text" class="textbox" placeholder="email address"> </div> <div class="field"> <input type="password" class="textbox" placeholder="password"> </div> <div class="field"> <label><a href="#" data-toggle="modal" data-target="#lostpassword" data-backdrop="static" data-keyboard="false" id="closelogin" data-dismiss="modal"> lost password?</a></label> </div> <div class="field"> <label> <input type="checkbox" name="autologin" value="1"> remember me</label> </div> <div class="field"> <button type="submit" class="submit" name="userlogin"><img src="<?php echo base_url();?>frontend/images/login-button.png"></button> </div> </form> </div> </div> </div> </div> <!-- login end --> <button type="button" data-toggle="modal" data-target="#login">open login modal</button>hope helps! :)
Comments
Post a Comment