Element resize events

resizable.js

var Resizable = (function(window, $) {

	'use strict';

	function Resizable(el, options) {
		this.el = el;
		this.$el = $(el);
		this.init();

		return this;
	}

	Resizable.prototype.init = function() {
		this.bind();
	};

	Resizable.prototype.bind = function() {
		var	mousePos = {};

		// bind to the body as the 'mouseup' event might be sent to a
		// different HTML element than the 'mousemove' event was
		$(window).on('mouseup.resizable', function(e) {

			$(window).off('mousemove.resizable');

			console.log('mouseup', mousePos);
		});

		this.$el.on('mousedown.resizable', function(e) {
			mousePos = {
				x: e.pageX,
				y: e.pageY
			};

			console.log('mousedown', mousePos);

			$(window).on('mousemove.resizable', function(e) {
				mousePos = {
					x: e.pageX,
					y: e.pageY
				};

				console.log('mousemove', mousePos)
			});
		});

		console.log('bind', mousePos)
	};

	return Resizable;

}(window, jQuery));