Ext中Resizable的使用方法

 var ResizableExample = {
    init: function(){
        var basic = new Ext.Resizable('basic', {
            width: 200,
            height: 100,
            minWidth:100,
            minHeight:50
            //,pinned: true//是否隐藏外框
            ,animate:true//拖动时渐进式
            ,easing: 'backIn'//配合上个属性animate为true使用
            ,duration:.35//动画效果的持续时间,默认.35
            ,transparent:true
            ,handles: 'all'
            ,widthIncrement:50//每次拖动的单位,还有height
            ,draggable:true
        });
        var wrapped = new Ext.Resizable('wrapped', {
            wrap:true,
            //pinned:true,
            minWidth:50,
            minHeight: 50
            ,preserveRatio: true//按比例缩放
            ,transparent:true//是否有外框
        });
/*------------------------------------------------------------------------------------*/
        var custom = new Ext.Resizable('custom', {
            wrap:true,
            pinned:true,
            minWidth:100,
            minHeight: 50,
            preserveRatio: true,
            handles: 'all',//能拖动的面
            /*
                'n'     north
                's'     south
                'e'     east
                'w'     west
                'nw'    northwest
                'sw'    southwest
                'se'    southeast
                'ne'    northeast
                'all'   all
            */
            draggable:true
            ,dynamic:true//拖动的事后是否显示线,默认为false
        });
        var customEl = custom.getEl();
        // move to the body to prevent overlap on my blog
        document.body.insertBefore(customEl.dom, document.body.firstChild);
       
        customEl.on('dblclick', function(){
            customEl.hide(true);
        });
        customEl.hide();
       
        Ext.get('showMe').on('click', function(){
            customEl.center();
            customEl.show(true);
        });
/*------------------------------------------------------------------------------------*/
    }
};
 Ext.EventManager.onDocumentReady(ResizableExample.init, ResizableExample, true);

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值