/**
 * Make any html element draggable.
 *
 * @constructor
 * @param {Object} element Any html element
 * @param {Object} [options] Available options
 * @config {String} [axis] Forces element to move only vertically or horizontally.
 * Possible values: 'x' for horizontal movement, 'y' for vertical movement. Example { 'axis': 'x' }.
 *
 */
function Draggable(element, options){
	this.el = element;
	this.o = options;
	this.el.position = { x: parseInt($(element).css('left')), y: parseInt($(element).css('top')) };
	this._canMove = false;
	this._init();
}

Draggable.prototype = {
	_offset: { x: 0, y: 0 },
	_init: function(){
		$(this.el).bind('mousedown', $.proxy(this._mousedown, this));
		$(document).bind('mousemove', $.proxy(this._mousemove, this));
		$(document).bind('mouseup', $.proxy(this._mouseup, this));
	},
	_mousedown: function(e){
		e.preventDefault();
		this._canMove = true;
		this._offset.x = $(this.el).offset().left - e.pageX;
		this._offset.y = $(this.el).offset().top - e.pageY;
	},
	_mousemove: function(e){
		if(this._canMove){
			var x = this.o.axis === 'y' ? this.el.position.x : this._offset.x + e.pageX;
			var y = this.o.axis === 'x' ? this.el.position.y : this._offset.y + e.pageY;
			$(this.el).css({'left': x, 'top': y});
		}
	},
	_mouseup: function(){
		this._canMove = false;
	}
};

/**
 * Make any html element draggable.
 *
 * @constructor
 * @param {Object} element Any html element
 * @param {Object} [options] Available options
 * @config {String} [axis] Forces element to move only vertically or horizontally.
 * Possible values: 'x' for horizontal movement, 'y' for vertical movement. Example { 'axis': 'x' }.
 *
 */
function Draggable(element, options){
	this.el = element;
	this.o = options;
	this.el.position = { x: parseInt($(element).css('left')), y: parseInt($(element).css('top')) };
	this._canMove = false;
	this._init();
}

Draggable.prototype = {
	_offset: { x: 0, y: 0 },
	_init: function(){
		$(this.el).bind('mousedown', $.proxy(this._mousedown, this));
		$(document).bind('mousemove', $.proxy(this._mousemove, this));
		$(document).bind('mouseup', $.proxy(this._mouseup, this));
	},
	_mousedown: function(e){
		e.preventDefault();
		this._canMove = true;
		this._offset.x = $(this.el).offset().left - e.pageX;
		this._offset.y = $(this.el).offset().top - e.pageY;
	},
	_mousemove: function(e){
		if(this._canMove){
			var x = this.o.axis === 'y' ? this.el.position.x : this._offset.x + e.pageX,
			y = this.o.axis === 'x' ? this.el.position.y : this._offset.y + e.pageY;
			$(this.el).css({'left': x, 'top': y});
		}
	},
	_mouseup: function(){
		this._canMove = false;
	}
};

/**
 * Make any html element draggable.
 *
 * @constructor
 * @param {Object} element Any html element
 * @param {Object} [options] Available options
 * @config {String} [axis] Forces element to move only vertically or horizontally.
 * Possible values: 'x' for horizontal movement, 'y' for vertical movement. Example { 'axis': 'x' }.
 *
 */
function Draggable(element, options){
	this.el = element;
	this.o = options;
	this.el.position = { x: parseInt($(element).css('left')), y: parseInt($(element).css('top')) };
	this._canMove = false;
	this._init();
}

Draggable.prototype = {
	_offset: { x: 0, y: 0 },
	_init: function(){
		$(this.el).bind('mousedown', $.proxy(this._mousedown, this));
		$(document).bind('mousemove', $.proxy(this._mousemove, this));
		$(document).bind('mouseup', $.proxy(this._mouseup, this));
	},
	_mousedown: function(e){
		e.preventDefault();
		this._canMove = true;
		this._offset.x = $(this.el).offset().left - e.pageX;
		this._offset.y = $(this.el).offset().top - e.pageY;
	},
	_mousemove: function(e){
		if(this._canMove){
			var x = this.o.axis === 'y' ? this.el.position.x : this._offset.x + e.pageX,
				y = this.o.axis === 'x' ? this.el.position.y : this._offset.y + e.pageY;
			$(this.el).css({'left': x, 'top': y});
		}
	},
	_mouseup: function(){
		this._canMove = false;
	}
};

/**
 * Make any html element draggable.
 *
 * @constructor
 * @param {Object} element Any html element
 * @param {Object} [options] Available options
 * @config {String} [axis] Forces element to move only vertically or horizontally.
 * Possible values: 'x' for horizontal movement, 'y' for vertical movement. Example { 'axis': 'x' }.
 *
 * @property {number} id The id of the person.
 *
 */
function Draggable(element, options){
	this.el = element;
	this.o = options;
	this.el.position = { x: parseInt($(element).css('left')), y: parseInt($(element).css('top')) };
	this._canMove = false;
	this._init();
}

Draggable.prototype = {
	_offset: { x: 0, y: 0 },
	_init: function(){
		$(this.el).bind('mousedown', $.proxy(this._mousedown, this));
		$(document).bind('mousemove', $.proxy(this._mousemove, this));
		$(document).bind('mouseup', $.proxy(this._mouseup, this));
	},
	_mousedown: function(e){
		e.preventDefault();
		this._canMove = true;
		this._offset.x = $(this.el).offset().left - e.pageX;
		this._offset.y = $(this.el).offset().top - e.pageY;
	},
	_mousemove: function(e){
		if(this._canMove){
			var x = this.o.axis === 'y' ? this.el.position.x : this._offset.x + e.pageX,
				y = this.o.axis === 'x' ? this.el.position.y : this._offset.y + e.pageY;
			$(this.el).css({'left': x, 'top': y});
		}
	},
	_mouseup: function(){
		this._canMove = false;
	}
};

/**
 * Make any html element draggable.
 *
 * @constructor
 * @param {Object} element Any html element
 * @param {Object} [options] Available options
 * @config {String} [axis] Forces element to move only vertically or horizontally.
 * Possible values: 'x' for horizontal movement, 'y' for vertical movement. Example { 'axis': 'x' }.
 *
 * @property {number} id The id of the person.
 *
 */
function Draggable(element, options){
	this.el = element;
	this.o = options;
	this.el.position = { x: parseInt($(element).css('left')), y: parseInt($(element).css('top')) };
	this._canMove = false;
	this._init();
	this._limits()
}

Draggable.prototype = {
	_offset: { x: 0, y: 0 },
	_init: function(){
		$(this.el).bind('mousedown', $.proxy(this._mousedown, this));
		$(document).bind('mousemove', $.proxy(this._mousemove, this));
		$(document).bind('mouseup', $.proxy(this._mouseup, this));
	},
	_mousedown: function(e){
		e.preventDefault();
		this._canMove = true;
		this._offset.x = $(this.el).offset().left - e.pageX;
		this._offset.y = $(this.el).offset().top - e.pageY;
	},
	_mousemove: function(e){
		if(this._canMove){
			var x = this.o.axis === 'y' ? this.el.position.x : this._offset.x + e.pageX,
				y = this.o.axis === 'x' ? this.el.position.y : this._offset.y + e.pageY;
			$(this.el).css({'left': x, 'top': y});
		}
	},
	_mouseup: function(){
		this._canMove = false;
	}
};

Simple draggable class

JavaScript