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

Category: CSS & CSS3 , Modal & Popup | September 4, 2018
Author: botyk
Views Total: 511 views
Official Page: Go to website
Last Update: September 4, 2018
License: MIT

Preview:

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

Description:

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>
    <div class="modalFooter">
      Modal Footer
      <div>
        <button type="button" class="btn" data-close="true">Close</button>
        <button type="button" class="btn btnPrimary">Save</button>
      </div>
    </div>
  </div>
</div>

You Might Be Interested In:


Leave a Reply