缩放

最后更新于:2022-04-02 03:13:57

[TOC] ## 可调整尺寸小部件 demo ``` //style .ui-resizable-helper { border: 1px dotted gray; } //给拖动的部件添加虚线 $(".demo").resizable({ animate: true, aspectRatio: 16 / 9 , //保持纵横比 containment: "#container", //限制缩放区域 helper: "ui-resizable-helper", //默认 ui-resizable-helper 拖动时自动添加的类 ghost: true,//一个半透明视觉框 }) ``` 选项 ``` alsoResize:Selector 同步调整其他 部件 animate:Boolean 设置动画 aspectRatio:Boolean,Number 限制长宽比 autoHide:Boolean 当用户鼠标没有悬浮在元素上时是否隐藏手柄 delay:Number 鼠标按下调整按钮的生效时间 disabled:Boolean 禁用拖拽 ghost:Boolean 为调整尺寸显示一个半透明的辅助元素 grid:Array 可调整尺寸元素对齐到网格,每个 x 和 y 像素。数组形式必须是 [ x, y ] minHeight-maxHeight 设置元素的高界限 minWidth-maxWidth 设置元素的高界限 ``` 事件 ``` create( event, ui ) 当 resizable 被创建时触发。 resize( event, ui ) 在调整尺寸期间当调整手柄拖拽时触发。 start( event, ui ) 当调整尺寸操作开始时触发。 stop( event, ui ) 当调整尺寸操作停止时触发。 ```
';