通过鼠标的拖动改变DOM的高度和宽度

好久不写博客了......。

web前端开发中，通过鼠标的拖动改变控件高度和宽度的做法有多种。我以前使用的方法是：为控件添加mousemove事件，当鼠标移到边距时，显示cursor为e-resize，表示可以拖动。在mousedown事件中设置document的鼠标事件，在mouseup中移除document的鼠标事件。这样的做法导致：当鼠标移到控件上后，每动一下鼠标，就需要运行一次move事件。现在优化的做法是：在控件边距上加一div,当在此div上按下鼠标时才触发document的鼠标事件。大大减少了move事件的执行次数。

采用jquery写法，调用方法：$('#resizable').gresizeW();

        
              
    $.fn.gresizeW = function () {
        return this.each(function () {
            var jq = $(this);
            jq<