easyUI resizable组件使用:

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
<script src="easyui/jquery.min.js"></script>
<script src="easyui/jquery.easyui.min.js"></script>
<script src="easyui/locale/easyui-lang-zh_CN.js"></script>
<script src="js/test005.js"></script>
<link rel="stylesheet" href="easyui/themes/default/easyui.css">
<link rel="stylesheet" href="easyui/themes/icon.css">
</head> <body>
<div id="box2" class="easyui-resizable" style="border:1px solid black;width:300px;height:300px"></div>
<div id="box" style="border: 1px solid red;width:300px;height:300px"></div>
</body> </html>
$(function(argument) {
var obj = {
//disabled:true,//不能拖动了;
handles: 'all', //能够拖动的方向;n-上北,all-全部
minHeight: 200, //最小能够拖到的高度
minWidth: 200,
maxHeight: 400, //最大能够拖到的高度
maxWidth: 400,
edge: 10, //拖动的边的宽度
onStartResize: function(e) { //mousedown
console.log('onStartResize');
console.log(e);
},
onResize: function(e) { //mousemove
// console.log('onResize');
// console.log(e);
console.log($(this).resizable('options')); //获得options对象;
},
onStopResize: function(e) { //mouseup
console.log('onStopResize');
console.log(e);
}
};
$('#box').resizable(obj);
$('#box').resizable('disable'); //有效果呀;
$('#box2').resizable('disable'); //有效果呀;
}); 

easyUI resizable组件使用的更多相关文章

  1. Easyui部分组件讲解

    Easyui部分组件讲解 目  录 1.... Accordion(可折叠标签)... 2 1.1          实例... 2 1.2          参数... 3 2.... DateBo ...

  2. Easyui主要组件用法

    Easyui主要组件用法说明: 1.  combogrid用法 说明:combogrid可提供翻页列表的数据选择并可进行数据的过滤查询(查询的传人参数为q,可在控制器中获取这个参数传过来的值,下面的示 ...

  3. 对easyui datagrid组件的一个小改进

    #对easyui datagrid组件的一个小改进 ##问题 在实际项目中使用datagrid时,受版面限制,有时候表格不能太大,这时候表格里面的内容就不能完全显示,用户需要经常拖动调整列宽才能看完整 ...

  4. easyUI panel组件

    easyUI panel组件: 属性的使用: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  5. easyUI progressbar组件

    easyUI progressbar组件: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  6. easyUI linkbutton组件

    easyUI linkbutton组件: <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  7. easyUI tootip组件使用

    easyUI tootip组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  8. easyUI droppable组件使用

    easyUI droppable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  9. easyUI draggable组件使用

    easyUI draggable组件使用: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

随机推荐

  1. photosho 等距复制或旋转复制

    选区是不可以复制的,不过可以用这个方法:1.新建图层,任意绘制一个图形2.ctrl+j复制一层,ctrl+T 切换到变形工具,移动或变形该图形后enter.3.按Alt+Shift+ctrl+T.4. ...

  2. 考分鄙视(exam)

    考分鄙视(exam) 题目描述 Whence这个学期考了n次试,每一次都有一个0-20000之间的整数分数.Whence本来的状态应该是每一次考试都比前一次多一分(除第一次),但由于他很不稳定,偏差可 ...

  3. CG之基本光照模型计算公式

    在一个基本模型里,一个物体表面的颜色是由放射(emissive).环境反射(ambient).漫反射(diffuse)和镜面反射(specular)等光照作用的总和.每种光照作用取决于表面材质的性质( ...

  4. 一个不应该犯的错octave

    今天在完成Andrew NG的机器学习神经网络作业,在实现花费函数的时候,没有使用循环,直接向量计算.前面都想的挺好的,很快就想到了如何使用向量来计算,可是在扩展y的时候,犯了一个超级傻的错误. y是 ...

  5. ie6,ie7兼容性总结

    摘自: http://www.cnblogs.com/li0803/archive/2009/08/22/1552094.html 其实浏览器的不兼容,我们往往是各个浏览器对于一些标准的定义不一致导致 ...

  6. Android线程之异步消息处理机制(一)

    Android不允许在子线程中进行UI操作,但是有些时候,我们必须在子线程里去执行一些耗时任务,然后根据任务的执行结果来更新相应的UI控件.对于这种情况,Android提供了一套异步消息处理机制,完美 ...

  7. android 后台服务定时通知

    最近有个项目的要求是在程序退出之后,任然可以每天定时发通知,我们可以想下,其实就是后台开一个服务,然后时间到了就发下通知. 1.首先我们需要用到Service类. 先上代码在慢慢解释 package ...

  8. IOS开发-OC学习-NSTimer的使用

    上一篇博客中在改变属性值的时候使用了timer进行自动改变.关于NSTimer的更详细的用法如下: 定义一个NSTimer类型的timer,和一个count,其中timer是定时器,count是计数的 ...

  9. 更深入一点理解switch语句及c/c++对const的处理

    首先看一到用 c 编写的程序/* -------------------- filename : ta.c --------------- */int switch_test_first( int x ...

  10. TFS2013 升级至TFS2015及项目的创建

    TFS2015已发布想体验下新特性 由于现有数据库已经是SQLSERVER2012 SP1 开发工具VS2013 都符合升级要求 现在体验下吧 1.先下载TFS2015 运行安装向导一路NEXT 直至 ...