看着jquery的大小收缩，自己也尝试写了一个，其实就是增加了三个div来控制大小。

效果图

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"><html><head><metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"><title>resizable</title><styletype="text/css">body{-moz-user-focus:ignore;-moz-user-input:disabled;-moz-user-select:none;}.ui-resizable-bd{background:none;position:absolute;z-index:1000;}.ui-resizable-bd-east{cursor:e-resize;}.ui-resizable-bd-south{cursor:s-resize;}.ui-resizable-bd-corner{width:16px;height:16px;cursor:nw-resize;/*右下角小图标*/background:url(p_w_picpaths/resizable.JPG)no-repeat;}</style></head><body><divstyle='width:960px;height:600px;margin:0pxauto;'><divid='demo'style='width:200px;height:200px;border:1pxsolid;margin:0pxauto;'></div></div><scripttype="text/javascript"src='http://code.jquery.com/jquery-latest.min.js'></script><scripttype="text/javascript">/***jqueryresizable*@authorhuxiaoqi*/(function($){$.fn.resizable=function(cfg){varself=$(this);varBD_E=$("<divclass='ui-resizable-bdui-resizable-bd-east'></div>");varBD_S=$("<divclass='ui-resizable-bdui-resizable-bd-south'></div>");varBD_SE=$("<divclass='ui-resizable-bdui-resizable-bd-corner'></div>");varWIDTH=self.width();varHEIGHT=self.height();varpos=self.offset();varBD_WIDTH=3;//defaultborderwidthvardocumentObj=$(document);varbodyObj=$('body',documentObj);/**定义缩放最小值*/var_default={minwidth:50,minheight:50};varconfig=$.extend({},_default,cfg);//放入节点BD_E.insertAfter(self);BD_S.insertAfter(self);BD_SE.insertAfter(self);setBDPos(WIDTH,HEIGHT,pos.left,pos.top);documentObj.bind({'mousedown':function(e){if(isBD(e.target)){varcurrentTarget=e.target;varclassName=currentTarget.className;documentObj.bind('mousemove',function(e){pos=self.offset();WIDTH=self.width();HEIGHT=self.height();varwidth=e.pageX-pos.left;varheight=e.pageY-pos.top;if(className.indexOf('bd-east')!=-1){/**eastborder*/if(width>config.minwidth){self.width(width);setBDPos(width,HEIGHT,pos.left,pos.top);}bodyObj.css('cursor','e-resize');}elseif(className.indexOf('bd-south')!=-1){/**southborder*/if(height>config.minheight){self.height(height);setBDPos(WIDTH,height,pos.left,pos.top);}bodyObj.css('cursor','s-resize');}elseif(className.indexOf('bd-corner')!=-1){/**south-eastborder*/if(width>config.minwidth&&height>config.minheight){self.width(width);self.height(height);setBDPos(width,height,pos.left,pos.top);}bodyObj.css('cursor','se-resize');}});}},'mouseup':function(e){documentObj.unbind('mousemove');bodyObj.css('cursor','default');}});//getborderpositionfunctionsetBDPos(w,h,l,t){BD_E.css({'width':BD_WIDTH,'height':h,'left':l+w,'top':t});BD_S.css({'width':w,'height':BD_WIDTH,'top':t+h,'left':l});BD_SE.css({'left':l+w-BD_SE.width(),'top':t+h-BD_SE.height()});};//justifytargetisborder?functionisBD(target){if(target&&target.className){returntarget.className.indexOf('ui-resizable-bd')!=-1;}returnfalse;}};})(jQuery);</script><scripttype="text/javascript">$('#demo').resizable();</script></body></html>