How to Bootstrap modal opening on page load Using JS

generating preview

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Bootstrap Onload Modal - www.designerdeskonline.com</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet"> <style type="text/css"> </style> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <div class="row"> <a target="_blank" href="https://www.designerdeskonline.com/"> <h2>All the snippet's created by Designer Desk Online are free to use, Just copy and enjoy the code</h2> </a></div> </div> <button class="btn btn-default" data-toggle="modal" data-target=".bs-example-modal-lg">Large modal</button> </center> <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" id="onload"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title"><i class="fa fa-exclamation-circle"></i>Your title goes here</h4> </div> <div class="modal-body">Your content goes here</div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Submit</button> </div> </div> </div> </div> <script type="text/javascript"> $(window).load(function(){ $('#onload').modal('show'); }); </script> </body> </html>

How to Use this Elements / Source Code:

You Can Use Bootstrap modal opening on page load Using JS elements by select the above source code (CTRL + A) then copy the code (CTRL + C) and paste (CTRL + V) it in a blank html Page to initially test it. Then you can use the Above Bootstrap modal opening on page load Using JS where ever you want for your project.

Usage of Bootstrap modal opening on page load Using JS:

The above article represent Here we show How to Bootstrap modal opening on page load & Create Bootstrap Modal Popup it takes following steps or Source Code. Create an website & use Onload popup modal Bootstrap when you try to use. Many website designer also can use this easily with our Source Code.

Use the Bootstrap.modal ('show') method You can use the Bootstrap.modal ('show') method for launching the modal window automatically when page load without clicking anything. A common example of this technique is loading the modal when user landed on the home page and requesting them to subscribe the website newsletter.

Best using of open modal on page load javascript is when you use a Popup Registration or Login form, Popup Notice or Information window or any kind of usage sa per your need.