Simple Customizable Modal Dialog Plugin with jQuery - Unmodal
| File Size: | 221 KB |
|---|---|
| Views Total: | 1053 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Unmodal is a simple, unobtrusive jQuery modal plugin used to create fully customizable modal windows and dialog boxes for web applications.
Features:
- Lightweight and simple to use.
- A great alternative to default alert, confirm, prompt boxes.
- Custom header, footer and buttons.
- Supports plain text, html and ajax content.
How to use it:
1. Add jQuery library together with the jQuery unmodal plugin's stylesheet and JavaScript to your webpages.
<link rel="stylesheet" href="unmodal.css"> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="unmodal.js"></script>
2. Create a basic modal dialog with custom title and content.
$.unmodal({
title: 'Title',
sContent: 'Content'
});
3. Create a modal dialog with custom buttons.
$.unmodal({
title: 'Title',
btnOkText: 'Ok Button',
btnCancelText: 'Cancel Button'
});
4. Create a 'fixed' modal dialog that will stay in the middle of your screen.
$.unmodal({
title: 'Title',
sContent: 'fixed: true',
fixed: true
});
5. Configuration options and defaults.
$.unmodal({
// modal title
title: 'Unmodal',
// modal body
sContent: 'JQuery modal plugin',
// text for OK button
btnOkText: 'Ok',
// text for Cancel button
btnCancelText: 'Cancel',
// enable fixed mode
fixed: false,
// custom animation
animation: '',
// ESC to close the modal
esc: true,
// callbacks
onShown: null,
onClosed: null,
// shows background overlay
backdrop: true,
// background content
sBackdrop: null,
// shows modal header
header: true,
// header content
sHeader: null,
// shows modal footer
footer: true,
// footer content
sFooter: null
});
This awesome jQuery plugin is developed by wangchi. For more Advanced Usages, please check the demo page or visit the official website.











