写在最前
针对于在vue中实现拖拽改变两左右个div大小的方式,请查看上一篇文章《vue中实现拖动调整左右两侧div的宽度》。此文章主要针对于实际应用中需要拖拽改变大小的组件中使用ifr a me框架时存在明显卡顿的问题,比如这样,右侧div中使用了一个ifr a me组件,导致实际操作中出现两个问题,一个是拖不动,另外一个是无法根据鼠标移动,快速响应,甚至在监听鼠标的按下和松开事件上都有明显的卡顿问题。如果去除右侧ifr a me框架,则没有问题。
有ifr a me情况
无ifr a me
今天写了一天这个jquery插件:
可以实现对div进行拖拽来调整大小的功能。
代码如下:
(function ($) {
$.fn.dragDivResize = function () {
var deltaX, deltaY, _startX, _startY;
var resizeW, resizeH;
var size = 20;
var minSize = 10;
var scroll = ge