Responsive Bootstrap-style Modal Window In Pure JS – Modal-JS

Author: botyk
Views Total: 757 views
Official Page: Go to website
Last Update: September 4, 2018
License: MIT


Responsive Bootstrap-style Modal Window In Pure JS – Modal-JS


The Modal-JS JavaScript modal plugin helps you create responsive, themeable, Bootstrap-style modal dialogs on the webapp.

How to use it:

Import the Modal-JS plugin’s files into the html document.

<link href="css/my.css" rel="stylesheet">
<script src="js/my.js"></script>

Create the HTML for the modal dialog. You can also use the following CSS class to apply themes to the modal.

  • modalPrimary
  • modalSuccess
  • modalInfo
  • modalWarning
  • modalDanger
<div id="myModal" class="modal">
  <div class="modalContent">
    <div class="modalHeader modalPrimary">
      <span class="modalClose" data-close="true" title="Close">&times;</span>
      Modal Header
    <div class="modalBody">
      <p>Modal Body</p>
    <div class="modalFooter">
      Modal Footer
        <button type="button" class="btn" data-close="true">Close</button>
        <button type="button" class="btn btnPrimary">Save</button>

See also  Create A Realistic Switch With Pure CSS & CSS3

Leave a Reply

Your email address will not be published. Required fields are marked *