Press "Enter" to skip to content

Simple Modal Solution Using Pure JavaScript and CSS | bp-modal.js

Modals (or bp-modal) is a simple modal solution using pure JavaScript and CSS that helps you display a clean and responsive modal window on your web page.

responsive modal popup, responsive modal popup bootstrap, modal box, automatic modal popup, pure css modal, animated modal popup using jquery

How to make use of it:

Add the modal.min.css within the header for primary modal styles.

<link rel="stylesheet" href="modal.min.css">

Add the bp-modal.min.js script in your doc, earlier than the closing body tag.

<script src="bp-modal.min.js"></script>

Create a medium-sized modal window following the markup structure as proven below.

<div id="test" class="modal modal-medium modal-closeable">
  <div class="modal-header">
    <h2>Modal Header</h2>
  </div>
  <div class="modal-content">
    <p>Modal Content</p>
  </div>
</div>

You can launch the modal window utilizing any component which has the corresponding value.

<p data-modal="test">Click me!</p>

Minimal Responsive Modal Box, Modals (or bp-modal) Plugin/Github


See Demo And Download

Official Website(PrattFall): Click Here

This superior jQuery/javascript plugin is developed by PrattFall. For extra Advanced Usages, please go to the official website.

Be First to Comment

    Leave a Reply

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