drag the handler, resize the element before and after it

jquery.dragResize.js

(function($){
  $.fn.dragResize = function(handler, lefter, righter){
		handler = $(handler);
		lefter = $(lefter);
		righter = $(righter);

		var dragging = false, oldX = 0;
		handler.mousedown(function(e){
			dragging = true;
			oldX = e.pageX;
		});

		$(document).mouseup(function(){
			dragging = false;
		}).mousemove(function(e){
			if (dragging) {
				e.preventDefault();
				var dX = e.pageX - oldX;
				oldX = e.pageX;
				lefter.width(lefter.width() + dX);
				righter.width(righter.width() - dX);
			};
		});
	};
})(jQuery);