学步园

 又整理好了2个，发上来与大家分享。

 

Resizable  改变尺寸大小（缩放）

 

相信看过JQuery 官方IU的也一定知道Resizable的用法，其实EasyUI用起来也很简单，可以以说是一样的道理。

 

HTML代码

<div id="rr" style="width:100px;height:100px;border:1px solid #ccc;"></div>

 

JQuery代码

$('#rr').resizable(options);

 

事件说明

名字	参数	描述
onStartResize	e	开始缩放触发
onResize	e	缩放期间触发
onStopResize	e	缩放结束触发

 

 

特性说明

名字	类型	描述	默认值
disabled	boolean	对象不否能被缩放，false代表可以	false
handles	string	缩放方向，默认东南西北，都可以	n, e, s, w, ne, se, sw, nw, all
minWidth	number	缩放最小宽度	10
minHeight	number	缩放最小高度	10
maxWidth	number	缩放最大宽度	10000
maxHeight	number	缩放最大高度	10000
edge	number	被缩放边缘的border	5

 

 

查看演示    官方文档

 

 

 Menu【菜单】

菜单可以包含许多菜单项、菜单项可以显示子菜单。
你也可以右点击显示文本菜单。

 使用说明

HTML代码

<div id="mm" style="width:120px;">
        <div>New</div>
        <div>
                <span>Open</span>
                <div style="width:150px;">
                        <div><b>Word</b></div>
                        <div>Excel</div>
                        <div>PowerPoint</div>
                </div>
        </div>
        <div icon="icon-save">Save</div>
        <div class="menu-sep"></div>
        <div>Exit</div>
</div>

 

JQuery创建一个菜单
 

$('#mm').menu(options);

 

 菜单定位

$('#mm').menu('show', {
  left: 200,
  top: 100
});

 

事件说明

名字	参数	描述
onShow	none	菜单显示后触发
onHide	none	菜单隐藏后触发

 

方法说明

名字	参数	描述
show	pos	指定位置显示一个菜单。 pos有两种特性参数。 left：新指定left位置。 top：新指定top位置。
hide	none	隐藏菜单

 

特性说明

名字	类型	描述	默认值
zIndex	number	增加子菜单时候，菜单z-index风格	110000
left	number	Menu left position.	0
top	number	Menu top position.	0
href	string	当你点击菜单项目时候，可以在当前的浏览器窗口显示一个不同的网页链接	null

 

查看演示    官方文档