Handle Layout Expand/Collapse Events

EasyUI Forum

May 03, 2024, 02:48:50 PM

Welcome, Guest. Please login or register.

News:

Home

Help

EasyUI Forum > General Category > EasyUI for jQuery > Handle Layout Expand/Collapse Events

Pages: [1]

« previous next »

Author

Topic: Handle Layout Expand/Collapse Events (Read 37861 times)

LWardwell

Newbie

Posts: 7

Handle Layout Expand/Collapse Events

« on: December 16, 2011, 02:42:37 PM »

Is it possible on the layout, not portal layout, to trap the expand/collapse or resize events? Thanks


	Logged

stworthy

Administrator
Hero Member

Posts: 3581

Re: Handle Layout Expand/Collapse Events

« Reply #1 on: December 16, 2011, 06:37:34 PM »

Get the layout panel and add event handler:

Code:

var p = $('body').layout('panel','west').panel({
	onCollapse:function(){
		alert('collapse');
	},
	onExpand:function(){
		alert('expand');
	},
	onResize:function(){
		alert('resize')
	}
});


	Logged

LWardwell

Newbie

Posts: 7

Re: Handle Layout Expand/Collapse Events

« Reply #2 on: January 06, 2012, 09:33:48 AM »

Is it possible to create a layout with a panel(s) initially collapsed, rather than having to call the collapse method?


	Logged

stworthy

Administrator
Hero Member

Posts: 3581

Re: Handle Layout Expand/Collapse Events

« Reply #3 on: January 09, 2012, 02:06:49 AM »

To initialize the collapsed layout panel, set 'collpased' property to true. Please download the layout plugin from http://www.jeasyui.com/easyui/plugins/jquery.layout.js to support this feature.

Code:

<body class="easyui-layout">
	<div region="north" border="false" style="height:60px;background:#B3DFDA;padding:10px">north region</div>
	<div region="west" split="true" collapsed="true" title="West" style="width:150px;padding:10px;">west region</div>
	<div region="east" split="true" title="East" style="width:100px;padding:10px;">east region</div>
	<div region="south" border="false" style="height:50px;background:#A9FACD;padding:10px;">south region</div>
	<div region="center" title="Main Title">
	</div>
</body>


	Logged

Pages: [1]

« previous next »