天天看点

13EasyUI 布局- 为网页创建边框布局

边框布局(border layout)提供五个区域:east、west、north、south、center。以下是一些通常用法:

  • north 区域可以用来显示网站的标语。
  • south 区域可以用来显示版权以及一些说明。
  • west 区域可以用来显示导航菜单。
  • east 区域可以用来显示一些推广的项目。
  • center 区域可以用来显示主要的内容。
<div class="easyui-layout" style="width:400px;height:200px;">
        <div region="west" split="true" title="Navigator" style="width:150px;">
            <p style="padding:5px;margin:0;">Select language:</p>
            <ul>
                <li><a href="javascript:void(0)" "showcontent('java')">Java</a></li>
                <li><a href="javascript:void(0)" "showcontent('cshape')">C#</a></li>
                <li><a href="javascript:void(0)" "showcontent('vb')">VB</a></li>
                <li><a href="javascript:void(0)" "showcontent('erlang')">Erlang</a></li>
            </ul>
        </div>
        <div id="content" region="center" title="Language" style="padding:5px;">
        </div>
    </div>
      
function showcontent(language){
        $('#content').html('Introduction to ' + language + ' language');
    }