Create Custom Modal Dialogs In Vanilla JavaScript – MarcDialogs.js

Category: Javascript , Modal & Popup | June 30, 2017
Author: marcrobledo
Views Total: 1,297
Official Page: Go to website
Last Update: June 30, 2017
License: MIT

Preview:

Create Custom Modal Dialogs In Vanilla JavaScript – MarcDialogs.js

Description:

MarcDialogs.js is a vanilla JavaScript plugin for creating modal-style alert/confirm/prompt/custom dialog boxes in the web applications.

How to use it:

Link to the MarcDialogs’ JavaScript and Stylesheet files:

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

Create a basic alert dialog.

MarcDialogs.alert('Custom message');

Create a basic confirmation dialog.

MarcDialogs.confirm('Confirm message', function(){alert('Action Here');MarcDialogs.close()});

Create a custom dialog that loads content from any html elements within the document.

<div id="dialog-custom" class="dialog">
  Custom content here
  <button onclick="MarcDialogs.close()">Cancel</button>
  </div>
</div>
MarcDialogs.open('custom');

Leave a Reply