EasyUI之layout

var cc= $("#cc").layout();//获取对象

cc.layout("collapse","west");//调用对象方法
var centerPanel = $("#cc").layout("panel","center");//获取中间panel对象

centerPanel.panel("option").title;//获取center的title标题名称
$(‘#cc‘).layout(‘add‘,{
    region: ‘east‘,
    width: 180,
    title: ‘eastttt Title‘,
    split: false,
    collapsible:false,
    tools: [{
        iconCls:‘icon-add‘,
        handler:function(){alert(‘add‘)}
    },{
        iconCls:‘icon-remove‘,
        handler:function(){alert(‘remove‘)}
    }]
});

效果如下:

时间: 2024-08-28 14:25:05

EasyUI之layout的相关文章

第二百零二节,jQuery EasyUI,Layout(布局)组件

jQuery EasyUI,Layout(布局)组件 学习要点: 1.加载方式 2.布局属性 3.区域面板属性 4.方法列表 本节课重点了解 EasyUI 中 Layout(布局)组件的使用方法,这个组件依赖于 Panel(面 板)组件和 resizable(调整大小)组件. 一.加载方式 class 加载方式,这个属性一般使用class方法使用 <body id="box" class="easyui-layout"> <div data-opt

CI 笔记3 (easyui 的layout布局,最小化layout原型)

在做easyui的layout的布局时,最小化一个原型 在设置的5个区中,div的最后一个,必须是data-options=center,如果是别的区,将报白屏异常. 在layout的5个区中,最小化显示,必须有三个<div data-options>,从父层进入后,最小化必须有三个,才会显示,且最后一个必须为center.父层的div的style,可无高度的大小.

easyui中layout、accordion加tabs实现简单菜单布局实例

一般对于后台界面都是采用BorderLayout进行布局的.BorderLayout也就是将界面分成五块,如下图所示,分别有:North.East.South.West.Center 其中比较特殊的是Center这块区域,它是不固定的,会随着四块区域的变化而做出相应的调整.比如将West向左缩小10px,那么Center则会向West方向扩张10px.其实这个easyUI已经帮我们实现好了,我们只需要使用它的layout就可以完成. <body class="easyui-layout&q

java web前端easyui(layout+tree+双tabs)布局+树+2个选项卡tabs

1.列出要实现的样式: 2.实现的代码: 分三大部分: 1):页面主体部分:mian.vm <html> <head> <title>Ks UI</title> #parse("ui:include") <style> body{padding:0;margin:0} </style> <script> $(document).ready(function(){ var tabs_content = $

Easyui 生成layout

var $tabs; var $body; var $south; function appendLayout(title, href) { if (!$body) $body = $(document.body); if (!$body.hasClass('layout')) { var $centerHtml = $("<div>", { "id": "center", "style": "heigh

EasyUI之layout布局(布局面板的响应事件)

jquery easyui框架中的layout布局: 遇到的问题:1.在五方布局中(north.sourth.east.west.center),east面板中,包含了两个div,其中的下面那个div里包含了tabs选项卡页签,但是页签不随面板的放大缩小而变化.如下图: 当设置east面板中包含的div的data-options:"fit:true"时: 第二个包含tabs的div并没有随着其父容器的大小变化而变化. 问题调试: 1.将第一个div与第二个div调换位置:发现只有处于上

关于EasyUI的Layout总结

版权声明:本文为博主原创文章,未经博主允许不得转载. 1.layout以html标签方式建立的 [html] view plain copy print? <div id="content" region="center" border="false" class="easyui-layout"> <div id="divPage1" data-options="region:'

easyui框架layout控件的使用

1.通过标记创建布局(Layout). 添加 'easyui-layout' class 到 <div> 标记. 1 <div id="cc" class="easyui-layout" style="width:600px;height:400px;"> 2 <div data-options="region:'north',title:'North Title',split:true" sty

jquery easyui的layout

1.创建一个布局:layout是一个容器,它有5个区域:north(北),south(南),east(东),west(西):center(中)-----------学习中文网地址 <body class="easyui-layout"> <div region="north" title="North Title" split="true" style="height:100px;">