Layout is a layout panel:
That is, the layout of the container, there are five layout areas: North, South, east, west and center. The Center area panel is required, but the Center Area Panel Edge Area panel is optional. By dragging its border, the panel can adjust each edge area. A layout that can be nested so that users can build complex layouts.
If you want the frames in each area to change with the size of the frame, nest in the layout frame;
Copy Code code as follows:
<script type= "Text/javascript" >
Split property: If set to true, a separator bar is displayed, and the user can drag the separator bar to change the size of the layout panel.
HREF attribute: Loads the part of the body of the page within the specified range, others do not load
In the panel framework we can see a regular selection that can be changed to suit your needs:
Extractor:function (data) {
var pattern =/<body[^>]*> (. | [\n\r]) *) <\/body>/im;
var matches = pattern.exec (data);
if (matches) {
return matches[1]; Only extract body content
} else {
return data;
// }
// }
Panel properties: Returns the specified layout panel, the value of the ' region ' parameter is: ' North ', ' South ', ' East ', ' West ', ' center '.
function Getpanel () {
var Southpanel = $ ("#layoutbody"). Layout (' panel ', ' South ');
Get the properties of a panel
var attributes = Southpanel.panel (' options ');
Console.info (attributes); You can see the various properties, browser debugging, here is explained: The use of this framework and use JS own writing foreground code, browser debugging is essential: Firefox or Google
}
</script>
<body id= "Layoutbody" class= "Easyui-layout" >
<div data-options= "region: ' North ', title: ' North title ', Split:true ' style= ' height:100px;" >
</div>
<div data-options= "region: ' South ', Title: ' South title ', Split:true ' style= ' height:100px;" >
</div>
<div data-options= "region: ' East ', Iconcls: ' Icon-reload ', title: ' East ', Split:true ' style= ' width:100px;" >
</div>
<div data-options= "region: ' West ', Title: ' West ', Split:true ' style= ' width:100px;" >
<input type= "button" value= "Get Panel" onclick= "Getpanel ();"/>
</div>
<div data-options= "region: ' Center ', title: ' Center title '" href= "index.htm" style= "padding:5px;
Background: #eee; " >
<input type= "button" value= "Get Panel" onclick= "Getpanel ();"/><!--if the href attribute is specified here, then our own code written in this section will not be realistic- >
</div>
</body>
