A Load mode
Class Load Mode
<div id= "box" class= "Easyui-window" title= "My window"
Style= "width:600px;height:400px"
data-options= "Iconcls: ' Icon-save ', modal:true" >
Window
</div>
JS Load Call
$ (' #box '). Window ({
width:600,
height:400,
Modal:true,
});
Two Property List
Window properties are extended from the panel, and the properties of the window are added or redefined as follows:
property settings
$ (' #box '). Window ({
width:600,
height:400,
Modal:true,
Collapsible:false,
Minimizable:false,
Maximizable:false,
Closable:false,
Closed:false,
zindex:9999,
Draggable:false,
Resizable:false,
Shadow:false,
Inline:false,
});
Container with the inline property
<div style= "position:relative;
width:500px;height:300px;overflow:auto;border:1px solid #ccc; " >
<div id= "box" > Windows </div>
</div>
PS: The above properties are the properties of window to expand or replace the panel itself, the window itself is dependent on the panel
Of So, see the properties of the Panel if there are no attributes involved. Like what:
The fit and iconcls here come from the Panel properties
$ (' #box '). Window ({
width:600,
height:400,
Modal:true,
Fit:true,
Iconcls: ' Icon-add ',
});
Three Event List
The window's events are fully inherited from the panel. So, simply refer to the panel's events.
Window Event
$ (' #box '). Window ({
width:600,
height:400,
Modal:true,
Onclose:function () {
Alert (' Trigger when off! ‘);
},
});
Four Method List
The window method expands from panel (faceplate), and the window is added as follows:
Returns the External Window object
Console.log ($ (' #box '). Window (' window '));
Adjust position when clicked
$ (document). Click (function () {
$ (' #box '). Window (' move ', {
left:0,
top:0,
});
});
Restore various centers while double-clicking
$ (document). DblClick (function () {
Replace with center or vcenter also
$ (' #box '). Window (' Hcenter ');
});
Use $.fn.window.defaults to override the default value object.
The most powerful part of the window component is the ability to internally layout and add LinkButton.
The specific layout method is as follows:
1. Wrap it externally with the window component;
2. Internal layout of the components left and right to assign one, the bottom of the allocation of one;
3. Add a button at the bottom.
Window (Windows)