EasyUI Resizable 可调整尺寸
EasyUI 调整 尺寸
2023-09-27 14:21:48 时间
通过 $.fn.resizable.defaults 重写默认的 defaults。
用法
通过标记创建可调整尺寸(resizable)对象。
<div class="easyui-resizable" style="width:100px;height:100px;border:1px solid #ccc;" data-options="maxWidth:800,maxHeight:600"> </div>
使用 javascript 创建可调整尺寸(resizable)对象。
<div id="rr" style="width:100px;height:100px;border:1px solid #ccc;"></div>
$('#rr').resizable({ maxWidth:800, maxHeight:600 });
属性
名称 | 类型 | 描述 | 默认值 |
---|---|---|---|
disabled | boolean | 如果设置为 true,则禁止调整尺寸。 | false |
handles | string | 指可调整尺寸(resizable)的方向,'n' 是北,'e' 是东,等等。 | n, e, s, w, ne, se, sw, nw, all |
minWidth | number | 调整尺寸时最小宽度。 | 10 |
minHeight | number | 调整尺寸时最小高度。 | 10 |
maxWidth | number | 调整尺寸时最大宽度。 | 10000 |
maxHeight | number | 调整尺寸时最大高度。 | 10000 |
edge | number | 被调整尺寸的边框的边缘。 | 5 |
事件
名称 | 参数 | 描述 |
---|---|---|
onStartResize | e | 开始调整尺寸时触发。 |
onResize | e | 调整尺寸期间触发。返回 false 时,DOM 元素将不进行实际的调整尺寸动作。 |
onStopResize | e | 停止调整尺寸时触发。 |
方法
名称 | 参数 | 描述 |
---|---|---|
options | none | 返回可调整尺寸(resizable)选项(options)。 |
enable | none | 启用可调整尺寸(resizable)特性。 |
disable | none | 禁用可调整尺寸(resizable)特性。 |
相关文章
- easyui plugin —— etreegrid:CRUD Treegrid
- easyUI draggable插件使用不当,导致拖动div内部文本框无法输入;设置echarts数据为空时就显示空白,不要动画和文字
- 使用Jquery+EasyUI 进行框架项目开发案例讲解之三---角色管理源码分享
- Jquery -EasyUI
- JS动态修改页面EasyUI datebox不生效、EasyUI动态添加Class、EasyUI动态渲染解析解决方案
- easyui 时间段校验,开始时间小于结束时间,并且时间间隔不能超过30天
- easyUI datagrid 列宽自适应(简单 图解)(转)
- easyUI的同一dialog载入多次的情况解决
- JavaScript UI选型及Jquery EasyUI使用经验谈
- jquery easyui datagrid 分页显示总记录数