首页 > 其他 > 详细

easyUI resizable组件使用

时间:2015-10-07 09:39:47      阅读:765      评论:0      收藏:0      [点我收藏+]

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组件使用

原文:http://www.cnblogs.com/stono/p/4858219.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!