Minimal Modal Dialog Box Plugin with jQuery - Dialogbox
File Size: | 5.84 KB |
---|---|
Views Total: | 2116 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Dialogbox is a simple yet customizable jQuery plugin to create modal dialogs for alert, confirm, prompt actions and normal, success, warning, error messages.
How to use it:
1. Load the jQuery Dialogbox plugin's CSS in your document's head section.
<link href="jquery.dialogbox-1.0.css" rel="stylesheet">
2. Load jQuery library and the jQuery Dialogbox plugin's script at the bottom of your document.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="jquery.dialogbox-1.0.js"></script>
3. Create notification messages with the dialog box plugin.
$('body').dialogbox({ // normal, succes, warning, error, type:"normal", // dialog box title title:"Message", // dialog box body message:"It's a message!" });
4. Create a yes/no confirm dialog box.
$('body').dialogbox({ // yes/no, ok/cancel, retry/ignore/abort type:"yes/no", title:"Title", message:"It's a message!"},function($btn){ if($btn == "yes") { $('body').dialogbox({ type:"normal", title:"Result", message:"You pressed: Yes" }); } else if($btn == "no") { $('body').dialogbox({ type:"normal", title:"Result", message:"You pressed: No" }); } else if($btn == "close") { $('body').dialogbox({ type:"normal", title:"Result", message:"You pressed: Close" }); } });
5. Create a select prompt dialog box.
$('body').dialogbox({ // text, select type:"select", title:"Text Prompt", message:"Yourquestion...", options:"Opt1,Opt2,Opt3"},function($btn,$ans){ if($btn == "close") { $('body').dialogbox({ type:"normal", title:"Result", message:"You pressed: Close" }); } else if($btn == "ok") { $('body').dialogbox({ type:"normal", title:"Result", message:"You entered: " + $ans }); } });
6. All the default options.
type: 'normal', title: 'Message', message: 'WOW! It\'s a message!', direction: 'ltr', placeholder: null, options: '', splitter: ','
Change log:
v1.1 (2015-03-06)
- update & rename
This awesome jQuery plugin is developed by afraware. For more Advanced Usages, please check the demo page or visit the official website.