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. 提示：ArcGIS version not specified. You must call RuntimeManager.Bind before creating any ArcGIS components.错误

    ArcGIS10,然后就使用VS创建一个简单的AE应用程序,然后拖放一个toolbar.LicenseControl以及MapControl控件. 接着编译应用程序,编译成功. 然后单击F5运行程序, ...

  2. (中等) CF 585B Phillip and Trains，BFS。

    The mobile application store has a new game called "Subway Roller". The protagonist of the ...

  3. 已有 JS 模块化和打包方案收集

    模块化方案 RequireJS AMD 方案, 常用的 define 语法, 异步加载模块, 目前很多支持: 官网 http://requirejs.org/ Github https://githu ...

  4. UIButton 关灯小实验

    // 写在继承于UIViewController的子类中:创建单视图默认有ViewController类 // 实现:点击任何一颗UIButton,它四周的以及它自身都被变成红色,再点击就会变成原来的 ...

  5. Mysql update语句赋值嵌套与在表列中数据后面增加数据

    1.Mysql update语句赋值嵌套select  点击(此处)折叠或打开 update a set col=(select col from a where id='5') where id&g ...

  6. hashmap如何初始化

    现在知道的有两种: 1) Map<String, String> hashMap = new HashMap<String, String>(){            {   ...

  7. 模块之dir函数

    dir()函数你可以使用内建的dir函数来列出模块定义的标识符.标识符有函数.类和变量.当你为dir()提供一个模块名的时候,它返回模块定义的名称列表.如果不提供参数,它返回当前模块中定义的名称列表. ...

  8. js 截取字符串里的ip

    var ip_reg = /([\d\.]*)/ig; ip = ip_reg.exec(str); return ip; ip_reg会截取 '(' 开始的字符串,中间包含数字和 '.' .

  9. Android如何调用第三方SO库（转）

    源:Android如何调用第三方SO库 问题描述:Android如何调用第三方SO库:已知条件:SO库为Android版本连接库(*.so文件),并提供了详细的接口说明:已了解解决方案:1.将SO文件 ...

  10. 利用openURL，在IOS应用中打开另外一个应用

    在IOS中,实现一个应用启动另外一个应用,使用UIApplication的openURL:方法就可实现,这里以test跳到test02为例.(需要先创建这两个工程) 注册自定义URL协议(在test中 ...