bootstrap show modal on page load
<script type="text/javascript">
$(window).on('load',function(){
$('#myModal').modal('show');
});
</script>
bootstrap show modal on page load
<script type="text/javascript">
$(window).on('load',function(){
$('#myModal').modal('show');
});
</script>
bootstrap modal popup
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>
<!-- Modal -->
<div id="myModal" class="modal fade" role="dialog">
<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">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>
how to add bootstrap modal for video on page load
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="bootstrap.min.css">
<title>Hello, world!</title>
</head>
<body>
<h1>On page load show Modal Popup !</h1>
<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<video id="" width="100%" controls poster="video/thumb.jpg">
<source src="video/Login_via_Lynda_dot_com.mp4" type="video/mp4">
<source src="video/Login_via_Lynda_dot_com.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://khaalipaper.com/js/jquery-3.2.1.min.js"></script>
<script src="bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#exampleModal').modal({
show: false
}).on('hidden.bs.modal', function(){
$(this).find('video')[0].pause();
});
});
</script>
</body>
</html>
Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us