Sunday 23 April 2017

Showing bootstrap modal popup after delay

Tanmoy 10:34 Bootstrap, Bootstrap Modal Popup, JavaScript, Modal Popup

The following example shows how to create a basic modal after a short delay:

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>
      $(window).load(function () {
          setTimeout(function () {
              $('#onload').modal('show');
          }, 20000);
      });
  </script></head>
<body>

<div class="container">
  
  <!-- Modal -->
  <div class="modal fade" id="onload" role="dialog">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>
  
</div>

</body>
</html>

About CODE HELPER
Code helper is a website from where you can find code different technologies. We trided to provide sourse code which you can use design and develop a website simple way.

2 comments:

Amfahs Empire29 January 2021 at 22:52
Amfahs.com design websites and even develop apps for different types of operating systems. AMfahs build corporate web-based systems to help enterprises.
We also Give latest Jobs and Scholarship updates. we also have technology related latest information.
Digital Marketing Services
For more technology Updates Daily Tech News
if any one intrested for govt job click here Latest Jobs in Pakistan
for Scholarships click here Best Scholarships for Needy students
ReplyDelete
Replies
Anonymous30 March 2022 at 09:49
Showing Bootstrap Modal Popup After Delay - Asp Tanmoy >>>>> Download Now

>>>>> Download Full

Showing Bootstrap Modal Popup After Delay - Asp Tanmoy >>>>> Download LINK

>>>>> Download Now

Showing Bootstrap Modal Popup After Delay - Asp Tanmoy >>>>> Download Full

>>>>> Download LINK
ReplyDelete
Replies