jquery-dialogextend 2.0.4 [](http://stillmaintained.com/ROMB/jquery-dialogextend) [](https://travis-
npm install binary-com-jquery-dialogextendedjquery-dialogextend 2.0.4  
===
Download
===
development build
Compatible
===
- jQuery 1.11.1
- jQueryUI 1.11.0
Overview
===
- Neat, simple, and ABSOLUTELY unobtrusive
- Extending (instead of replacing) original jQuery UI dialog
- Maximize and minimize buttons
- Show/Hide close button
- Double-clickable title bar
- Enhanced title bar options
- Configurable icons
- Custom events
Demo
===
- Test Tool : http://romb.github.io/jquery-dialogextend/example.html
Tested Browsers
===
- Chrome 35
- Firefox 14
- IE 8
Please support this project
===
Donate Bitcoins: 1G8T7Xh2AN5ceduHmHT5TpPFUeddsnQHLQ
Options
===
#### closable ####
Type: Boolean
Usage: enable/disable close button
Default: true
#### maximizable ####
Type: Boolean
Usage: enable/disable maximize button
Default: false
#### minimizable ####
Type: Boolean
Usage: enable/disable minimize button
Default: false
#### collapsable ####
Type: Boolean
Usage: enable/disable collapse button
Default: false
#### minimizeLocation ####
Type: String
Usage: sets alignment of minimized dialogues
Default: 'left'
Valid: 'left', 'right'
#### dblclick ####
Type: Boolean, String
Usage: set action on double click
Default: false
Valid: false, 'maximize', 'minimize', 'collapse'
#### titlebar ####
Type: Boolean, String
Default: false
Valid: false, 'none', 'transparent'
#### icons ####
Type: Object
Default:
{
"close" : "ui-icon-circle-closethick", // new in v1.0.1
"maximize" : "ui-icon-extlink",
"minimize" : "ui-icon-minus",
"restore" : "ui-icon-newwin"
}
Valid: <jQuery UI icon class>
Events
===
#### load ####
Type: load
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"load" : function(evt, dlg) { ... }
});
//Bind to event by type
//NOTE : You must bind() the
$("#my-dialog")
.bind("dialogextendload", function(evt) { ... })
.dialogExtend();
#### beforeCollapse ####
Type: beforeCollapse
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"beforeCollapse" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendbeforeCollapse", function(evt) { ... });
#### beforeMaximize ####
Type: beforeMaximize
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"beforeMaximize" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendbeforeMaximize", function(evt) { ... });
#### beforeMinimize ####
Type: beforeMinimize
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"beforeMinimize" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendbeforeMinimize", function(evt) { ... });
#### beforeRestore ####
Type: beforeRestore
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"beforeRestore" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendbeforeRestore", function(evt) { ... });
#### collapse ####
Type: collapse
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"collapse" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendcollapse", function(evt) { ... });
#### maximize ####
Type: maximize
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"maximize" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendmaximize", function(evt) { ... });
#### minimize ####
Type: minimize
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"minimize" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendminimize", function(evt) { ... });
#### restore ####
Type: restore
Example:
//Specify callback as init option
$("#my-dialog").dialogExtend({
"restore" : function(evt) { ... }
});
//Bind to event by type
$("#my-dialog").bind("dialogextendrestore", function(evt) { ... });
Methods
===
#### collapse ####
Usage: Collapse the dialog without double-clicking the title bar
Trigger: dialogextendbeforeCollapse, dialogextendcollapse
Example:
$("#my-dialog").dialogExtend("collapse");
#### maximize ####
Usage: Maximize the dialog without clicking the button
Trigger: dialogextendbeforeMaximize, dialogextendmaximize
Example:
$("#my-dialog").dialogExtend("maximize");
#### minimize ####
Usage: Minimize the dialog without clicking the button
Trigger: dialogextendbeforeMinimize, dialogextendminimize
Example:
$("#my-dialog").dialogExtend("minimize");
#### restore ####
Usage: Restore the dialog from maximized/minimized/collapsed state without clicking the button
Trigger: dialogextendbeforeRestore, dialogextendrestore
Example:
$("#my-dialog").dialogExtend("restore");
#### state ####
Usage: Get current state of dialog
Return: String
Value: 'normal', 'maximized', 'minimized', 'collapsed'
Example:
switch ( $("#my-dialog").dialogExtend("state") ) {
case "maximized":
alert("The dialog is maximized");
break;
case "minimized":
alert("The dialog is minimized");
break;
case "collapsed":
alert("The dialog is collapsed");
break;
default:
alert("The dialog is normal");
}
Theming
===
The dialog will have class according to its current state.
Note : After using dialogExtend, close button will not be a direct child of title bar anymore. It will be wrapped by a button pane element
Example - Basic Config
===
$(function(){
$("#my-button").click(function(){
$("