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. Android WifiDisplay分析一：相关Service的启动

    网址:http://www.2cto.com/kf/201404/290996.html 最近在学习Android 4.4上面的WifiDisplay(Miracast)相关的模块,这里先从WifiD ...

  2. phpcms 细节

    Phpcms V9采用if语句判断当前栏目高亮.判断分类信息是否过期 10月05, 2013 by SJY 在用PC V9建站的时候,很多朋友会想到Phpcms V9判定当前栏目,让当前栏目高亮的功能 ...

  3. 导出WAS已部署的ear包的几种方法

    可以通过下面几种办法将部署好的工程导出为一个ear包. 1.最简单的,通过was的控制台导出: 首先登录控制台,进入"企业应用程序"管理页面,选中要导出的工程,点击"导出 ...

  4. VS2010与SVN

    http://blog.sina.com.cn/s/blog_4fe44775010182yl.html 在VS2010中使用SVN,必须先安装SVN的客户端,再安装VisualSVN(SVN的插件) ...

  5. Codeforces#362

    A题 题意:给定一串数列,t,t+s,t+s+1,t+2s,t+2s+1......问某一个数是否是数列当中的 题意:只需判断(x-t)与(x-t-1)能否整除s即可,注意起始时的判断 #includ ...

  6. 单应性(homography)变换的推导

    矩阵的一个重要作用是将空间中的点变换到另一个空间中.这个作用在国内的<线性代数>教学中基本没有介绍.要能形像地理解这一作用,比较直观的方法就是图像变换,图像变换的方法很多,单应性变换是其中 ...

  7. 3个人一起写的EI论文可以检索到啦~ --> Exploring the use of a 3D Virtual Environment in Chinese Cultural Transmission

    <a href='http://www.engineeringvillage.com/blog/document.url?mid=cpx_10ed754f14b5b7381b6M764b1017 ...

  8. slf4j与logback对接是如何将日志写到控制台的

    今天一个以前同事问了个RT的问题 我翻了下代码,简单跟了下 很简单 1. demo代码 package org.simonme.demo.log; import org.slf4j.Logger; i ...

  9. [无关IT]就这样在凌晨写一篇吧~

    由于新浪博客广告实在太嚣张,自己也都是转载,故决定搬家至此,一改只转不写的习惯T^T,争取记录一下自己的小成长~日后有时间把脑子里的小东西一点点写出来~(好可怕的说)... 好了,睡了!各位爷早睡~ ...

  10. html小知识

    button标签如果不设置type,默认是submit,会自动提交表单 input type=file, 添加multiple属性后可以同时选择多个文件,同时name设置接受一个数组 <inpu ...