Simple Flexible jQuery Dialog Popup Plugin - dialogBox

Just another jQuery dialog box plugin which provides a simple way to display popup / modal windows with a plenty of options for animations and custom styles.

More features:

• Auto close after a timeout.
• 7 built-in animation types: fade,newspaper,fall,scaled,flip-horizontal,flip-vertical,sign
• Adaptive content for responsive web layout.
• Confirm / cancel callback functions.
• Optional fullscreen mask layers.
• Supports inline elements or external data sources.
• 3 types of dialog boxes: normal, confirm, error.

How to use it:

1. Include the jQuery dialogBox plugin's stylesheet in the head section of the document.

<link rel="stylesheet" href="css/jquery.dialogbox.css">

2. Create a button input to trigger a dialog box.

<input type="button" value="click" id="btnDialog">

3. Create an empty element for the dialog box.

<div id="dialog"></div>

4. Include the jQuery dialogBox plugin's script after jQuery library.

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script src="js/jquery.dialogBox.js"></script>

5. Display a basic dialog box as you click on the trigger button.

$('#btnDialog').click(function(){
  $('#dialog').dialogBox({
    //OPTIONS
  })
})

6. Configuration options.

// the width/height of the dialog box.
width: null, 
height: null,  

// enable adaptive content
autoSize: true, 

// auto close after a timeout.
// requires 'time' option
autoHide: false, 

// timeout for auto close
time: 3000, 

// z-index
zIndex: 99999, 

// display a fullscreen mask layer
hasMask: false,  

// display a close button
hasClose: false,

// display confirm/cancel buttons
hasBtn: false, 

// confirm button text
confirmValue: null, 

// confirm callback
confirm: function(){},

// cancel button text
cancelValue: null,  

// cancel callback
cancel: function(){}, 

// fade,newspaper,fall,scaled,flip-horizontal,flip-vertical,sign,
effect: '',

// the type of your dialog box
// normal, error, correct (confirm dialog)
type: '', 

// custom dialog title
title: '',  

// custom dialog content
// strings or an exteral URL
content: '',

// Callback functions
callback: function(){},
close: function(){}

Change logs:

2015-10-22

• fixed setting bug

2015-07-17

• add a callback when close dialog

2015-06-19

• fix single text appear word wrap bug

2015-06-03

• fixed confirm button

2015-05-20

• fix for IE 7/8.

2015-05-14

• add marginheight and marginwidth to iframe

2015-05-13

• add content resource DOM object and jQuery object description
• add callback.

2015-05-11

• improvement for ajax operation.

2015-05-06

• fix dialogBox margin-top size when it's set auto size

2015-05-05

• refactor.

2015-05-04

• fix dialogBox can't vertical center when it's auto size
• fix dialogBox margin-top size when it's setting auto size

2015-04-28

• Fixed: can not popup new dialogs.
• Fixed: auto height bug

---

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