目录

-----------------------

Easyui入门视频教程 第05集---Easyui布局 复杂的布局

在每个 区域 里面 可以显示 不同的 内容 比如 tree tab

<div class="easyui-layout" style="width:700px;height:350px;">

                <div data-options="region:'north'" style="height:50px"></div>

                <div data-options="region:'south',split:true" style="height:50px;"></div>

                <div data-options="region:'east',split:true" title="East" style="width:180px;">

                        <ul class="easyui-tree" data-options="url:'../layout/tree_data1.json',animate:true,dnd:true"></ul>

                </div>

                <div data-options="region:'west',split:true" title="West" style="width:100px;">

                        <div class="easyui-accordion" data-options="fit:true,border:false">

                                <div title="Title1" style="padding:10px;">

                                        content1

                                </div>

                                <div title="Title2" data-options="selected:true" style="padding:10px;">

                                        content2

                                </div>

                                <div title="Title3" style="padding:10px">

                                        content3

                                </div>

                        </div>

                </div>

                <div data-options="region:'center',title:'Main Title',iconCls:'icon-ok'">

                        <div class="easyui-tabs" data-options="fit:true,border:false,plain:true">

                                <div title="About" data-options="href:'../layout/_content.html'" style="padding:10px"></div>

                                <div title="DataGrid" style="padding:5px">

                                        <table class="easyui-datagrid"

                                                        data-options="url:'../layout/datagrid_data1.json',singleSelect:true,fit:true,fitColumns:true">

                                                <thead>

                                                        <tr>

                                                                <th data-options="field:'itemid'" width="80">Item ID</th>

                                                                <th data-options="field:'productid'" width="100">Product ID</th>

                                                                <th data-options="field:'listprice',align:'right'" width="80">List Price</th>

                                                                <th data-options="field:'unitcost',align:'right'" width="80">Unit Cost</th>

                                                                <th data-options="field:'attr1'" width="150">Attribute</th>

                                                                <th data-options="field:'status',align:'center'" width="50">Status</th>

                                                        </tr>

                                                </thead>

                                        </table>

                                </div>

                        </div>

                </div>

        </div>

视频下载

http://pan.baidu.com/s/1c07UNG8

Easyui入门视频教程 第05集---Easyui复杂布局的更多相关文章

  1. Easyui入门视频教程 第04集---Easyui布局

    目录 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的 ...

  2. Easyui入门视频教程 第03集---Easyui布局

    Easyui入门视频教程 第03集---Easyui布局 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教 ...

  3. Easyui入门视频教程 第11集---Window的使用

    目录 Easyui入门视频教程 第11集---Window的使用   Easyui入门视频教程 第10集---Messager的使用  Easyui入门视频教程 第09集---登录完善 图标自定义   ...

  4. Easyui入门视频教程 第09集---登录完善 图标自定义

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  5. Easyui入门视频教程 第08集---登录实现 ajax button的使用

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  6. Easyui入门视频教程 第06集---Layout初始化和属性方法使用

    目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax button的使用  ...

  7. Easyui入门视频教程 第02集--- ASP.NET MVC下 搭建 EasyUI环境

    Easyui入门视频教程 第02集--- ASP.NET MVC下 搭建 EasyUI环境 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标 ...

  8. Easyui入门视频教程 第01集---认识Easyui

    认识EasyUI 目录 ----------------------- Easyui入门视频教程 第09集---登录完善 图标自定义   Easyui入门视频教程 第08集---登录实现 ajax b ...

  9. Easyui入门视频教程 第10集---Messager的使用

    Easyui入门视频教程 第10集---Messager的使用 <script type="text/javascript"> function show(){ $.m ...

随机推荐

  1. Fedora 18/19没有注销

    sudo yum install dconf-editor -y 定位到org > gnome > shell  勾选always-show-log-out http://www.ryan ...

  2. [leetcode]Interleaving String @ Python

    原题地址:https://oj.leetcode.com/problems/interleaving-string/ 题意: Given s1, s2, s3, find whether s3 is ...

  3. iOS开发-UITableView自定义Cell

    UITableView在iOS中开发的重要地位是毋庸置疑的,基本上应用中用到的比例是一半左右,而且大部分情况都是需要自定义单元格的,这样用户看到的App才能更有美感.之前写过UITableView的基 ...

  4. 遮罩层中的相对定位与绝对定位(Ajax)

    前提:公司最近做的一个项目列表,然后点击项目,出现背景遮罩层,弹出的数据框需要异步加载数据数据,让这个数据框居中,搞了两天终于总算达到Boss满意的程度,做了半年C/S,反过来做B/S,顿时感到技术还 ...

  5. vue里ref ($refs)用法

    ref 有三种用法: 1.ref 加在普通的元素上,用this.ref.name 获取到的是dom元素 2.ref 加在子组件上,用this.ref.name 获取到的是组件实例,可以使用组件的所有方 ...

  6. 在Android上山寨了一个Ios9的LivePhotos，放Github上了

    9月10号的凌晨上演了一场IT界的春晚,相信很多果粉(恩,如果你指坚果,那我也没办法了,是在下输了)都熬夜看了吧,看完打算去医院割肾了吧.在发布会上发布了游戏机 Apple TV,更大的砧板 Ipad ...

  7. Android -- 状态栏高度

    干货 Class<?> c = null; Object obj = null; Field field = null; int x = 0, sbar = 0; try { c = Cl ...

  8. Docker-machine创建虚机时停在虚机启动的提示上，并且创建的虚机显示Ip Not found

    Docker-machine创建虚机时停在虚机启动的提示上,并且创建的虚机用docker-machine ls 列出来的时候显示Ip Not found, 是什么原因那? [答案] 看这个帖子: ht ...

  9. 【Python】使用内置base64模块进行编解码

    代码: import hashlib import base64 hash = hashlib.md5() hash.update('逆火Tu22m'.encode('utf-8')) print(h ...

  10. Mybatis源码分析之SqlSessionFactory（一）

    简介 MyBatis的前身叫iBatis,本是apache的一个开源项目, 2010年这个项目由apache software foundation 迁移到了google code,并且改名为MyBa ...