受欢迎的博客标签
Responsive Fullscreen Modal Plugin For Bootstrap 3 And 4   Tweet     File Size: 8.21 KB Views Total: 4252 Last Update: 10 months ago Publish Date: 11 months ago Official Website: Go to website License: MIT     Demo Download How to start using jQuery? More in this category... View our Recommended Plugins TOP 100 jQuery Plugins 2017   Chrome, MS Edge, FireFox, Opera, Safari#Modal#Bootstrap   bs-modal-fullscreen.js is a jQuery plugin that makes your Bootstrap 3 / 4 modal component responsive and fullscreen to fit any screen size. How to use it: 1. Insert the bs-modal-fullscreen.js script to your Bootstrap 3 or 4 project. 1 <link rel="stylesheet" href="/path/to/bootstrap.min.css"> 2 <script src="/path/to/jquery.min.js"></script> 3 <script src="/path/to/bootstrap.min.js"></script> 4 <script src="dist/bs-modal-fullscreen.js"></script> 2. Add the CSS class 'modal-fullscreen' to your Bootstrap modal component. 01 <div class="modal fade modal-fullscreen" id="my<a href="https://www.jqueryscript.net/tags.php?/Modal/">Modal</a>"> 02   <div class="modal-dialog" role="document"> 03     <div class="modal-content"> 04       <div class="modal-header"> 05         <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 06           <span aria-hidden="true">&times;</span> 07         </button> 08         <h4 class="modal-title">Modal title</h4> 09       </div> 10       <div class="modal-body"> 11         <p>One fine body&hellip;</p> 12       </div> 13       <div class="modal-footer"> 14         <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 15         <button type="button" class="btn btn-primary">Save changes</button> 16       </div> 17     </div><!-- /.modal-content --> 18   </div><!-- /.modal-dialog --> 19 </div><!-- /.modal --> 3. Create a trigger button to launch the modal window. 1 <button type="button" class="btn btn-lg" data-toggle="modal" data-target="#myModal" id="trigger-btn">Launch</button> 4. Make your modal window fullscreen manually. 1 $('#myModal').fullscreen(); .