DragResize - Resize和Drag类的合并优化版

　　前两天发布了Resize和Drag两个类，但它们代码有很多相似的地方。现在，我将它们整合为一个类(DragResize)，并增加select功能（就是选择两个点形成的矩形）。它与之前的两个类相比更友好，更健壮，更容易理解。它仍然是基于jQuery的。再次与大家分享。

Resize and Drag 效果： 

　　

drag

you can resize and drag this.

Select 效果： 　

　　鼠标点击一下，拖动鼠标，再松开就可以得到一个矩形。 

 

　　select 启动函数：oPos是一个始终不变的定点。start函数是初始化动作的。

select: function(e, x, y) {
    $(this.target).height(0).width(0).show();
    this.start(e, 'selecting');
    this.oPos = {x:this.boundx(x), y:this.boundy(y)};
}

 

　　onSelecting 事件函数：两个点的X值，较大的始终是border.right，较小的始终是border.left。border.bottom 和border.top也是一样。adjust函数用来调整对象的位置，高宽。

onSelecting: function(e){
    this.border = {'left':this.oPos.x,'top':this.oPos.y, 'right':this.boundx(e.pageX), 'bottom':this.boundy(e.pageY)};
    if(this.border.right <= this.border.left) {this.border.left= this.border.right ;this.border.right = this.oPos.x;}
    if(this.border.bottom <= this.border.top) {this.border.top = this.border.bottom;this.border.bottom= this.oPos.y;}
    this.adjust(this.border.left - this.parentOffset.left, this.border.top - this.parentOffset.top, 
                this.border.right - this.border.left     , this.border.bottom- this.border.top);
    return false;
}

  

下载：

　　点击下载DragResize类