JQuery easyui （3） Resizable（调整大小）组件

 Resizable  动态调整元素大小  不依赖其他组件

 

　　Resizable的加载方法 

 <div class="easyui-resizable"></div>　　　　//class加载
$("#box").resizable({});                //js 加载

 

　　Resizable属性列表

$("#box").resizable({
    disabled : true,    //默认为false，设置为true则禁用调整大小
    handles : 'se',        //默认为n,e,s,w,ne,se,sw,nw,all,生命调整的方向,分别是东南西北
    minWidth : 200,
    minHeight :200,           // 调整的最小宽度高度 默认值为10
    maxWidth : 500,
    maxHeight : 500,        // 调整的最大宽度，高度 默认值为10000
    edge : 20,                    // 边框边缘触发大小  默认值为5
   });    

     

　　Resizable事件

onStartResize : function(e){
    //开始改变大小时触发
}
onResize : function(e){
    //调整大小时触发
    return false;         //当返回false时，不会实际改变dom元素的大小
}
onStopResize : function(e){
    //停止调整大小事触发
}

 

　　Resizable方法

$("#box").resizable('options');  //返回属性对象
$("#box").resizable('enable');   //启用调整大小
$("#box").resizable('disable');   //禁止调整大小

 

easyui 1.3.5 Resizable 大概就这么多

逐渐发现easyui很多属性,方法，还有事件都差不多。