Easy Draggable jQuery Alert/Confirm Dialog Plugin - dialog.js

dialog.js is a tiny and cross-browser jQuery plugin that creates draggable, stackable and configurable popup boxes to replace the native alert / confirm dialogs.

How to use it:

1. Include the style sheet dialog.css in the head section, and the JavaScript file dialog.js at the end of the document. The plugin relies on JQuery so you first need to include the latest jQuery library in the document as follow:

<link href="dialog.css" rel="stylesheet">
<script src="//code.jquery.com/jquery.min.js"></script>
<script src="dialog.js"></script>

2. Create a new Dialog() object.

myDialog.open('hello, world')

3. Show the dialog with custom alert message in the screen.

myDialog.open('hello, world')

4. Config the plugin to show a confirm dialog with close/confirm callbacks in the screen.

myDialog.open({
  title: 'Are You Sure',
  isShowCloseBtn: true,
  isShowConfirmBtn: true,
  onClose: function() {
    console.log('close')
  },
  onConfirm: function() {
    console.log('confirm')
  }
})

5. All default config options.

myDialog.open({

  // dialog title
  title: '',

  // dialog message
  message: '',

  // shows close button
  isShowCloseBtn: true,

  // shows confirm button
  isShowConfirmBtn: false,

  // triggered when you click on the close button
  onClose: function() {},

  // triggered when you click on the confirm button
  onConfirm: function() {}
  
})

---

This awesome jQuery plugin is developed by LeeCL. For more Advanced Usages, please check the demo page or visit the official website.