EasyUI 學習隨筆(layout)

1、可以在一個Div內建立一個layout

  1. <div id="cc" class="easyui-layout" style="width:600px;height:400px;">  
  2.     <div region="north" title="North Title" split="true" style="height:100px;"></div>  
  3.     <div region="south" title="South Title" split="true" style="height:100px;"></div>  
  4.     <div region="east" iconCls="icon-reload" title="East" split="true" style="width:100px;"></div>  
  5.     <div region="west" split="true" title="West" style="width:100px;"></div>  
  6.     <div region="center" title="center title" style="padding:5px;background:#eee;"></div>  
  7. </div>  
    (注：如果在一個Div內建立一個layout，在style內指定Size是必須的，否則無沒顯示)

2、可以在整個頁面建立一個layout

  1. <body class="easyui-layout">  
  2.     <div region="north" title="North Title" split="true" style="height:100px;"></div>  
  3.     <div region="south" title="South Title" split="true" style="height:100px;"></div>  
  4.     <div region="east" iconCls="icon-reload" title="East" split="true" style="width:100px;"></div>  
  5.     <div region="west" split="true" title="West" style="width:100px;"></div>  
  6.     <div region="center" title="center title" style="padding:5px;background:#eee;"></div>  
  7. </body>  

用法：
Layout Panel Options

NameTypeDescriptionDefault
title string layout的標題文字，如不設置，則不能出現折疊按鈕 null
region string

layout的位置,必須為以下的值: north, south, east, west, center.
(注：在如果不註明則不會顯示該Div)

  
border boolean 是否顯示邊框 true
split boolean 顯示分拆條，並可拖動改變 Size false
iconCls string An icon CSS class to show a icon on panel header. null
href string An URL to load data from remote site. null

Methods

NameParameterDescription
resize none Set the layout size.
panel region Return the specified panel, the 'region' parameter possible values:'north','south','east','west','center'.
collapse region Collapse the specified panel, the 'region' parameter possible values:'north','south','east','west'.
expand region Expand the specified panel, the 'region' parameter possible values:'north','south','east','west'.
posted @ 2012-02-13 10:19  Dino Fung  阅读(884)  评论(0)    收藏  举报