Изменение размера изображения удерживанием кнопки мыши и растягиванием (JavaScript)

Принцип использования: наводим курсор мыши на определенную область (правый нижний угол), удерживаем кнопку мыши и растягиваем изображение по горизонтали и вертикали. Изображение можно как увеличивать, так и уменьшать в размерах. HTML-код, используемый для работы скрипта:

<div class="resize-picture" style="width: 400px; height: 200px;">
  <img src="images/image1.jpg" id="image1" style="width:400px;height:200px">

  <div class="corner" onmousedown="resize(this,event)"><img src="images/corner.png" /> </div>
</div>

Итак, на веб-странице появляются 2 изображения - картинка, которая будет изменяться в размерах(image1.jpg), и картинка с изображением уголка (corner.jpg), перетаскивание которого изменяет размер картинки "image1". Примечание: обе картинки расположены в папки images! Далее минимальный код CSS:

.resize-picture {
	position: relative;
	border: dashed 1px;
}

.resize-picture img {
	position: relative;
	display: block;
}

/* угол изображения */
.corner {
	position: absolute;
	width: 20px;
	height: 20px;
	bottom: 0;
	right: 0;
	cursor: se-resize;
	display: block;
}

.corner img {
	position: relative;
	width: 20px;
	height: 20px;
	border: none;
	display: block;
}

Скрипт, выполняющий действия с изображениями:

function resize (corner, event) {
	if (document.addEventListener) {
		document.addEventListener ("mousemove",moveCorner,true);
		document.addEventListener ("mouseup",upCorner,true);
	}
	else if (document.attachEvent) {
		corner.setCapture();
		corner.attachEvent("onmoosemove",moveCorner);
		corner.attachEvent("onmouseup",upCorner);

		corner.attachEvent("onlosecapture",upCorner);
	}

	if (event.stopPropagation) event.stopPropagation();
	else event.cancelBubble = true;

	if (event.preventDefault) event.preventDefault();
	else event.returnValue = false;
}

function moveCorner(e) {
	if (!e) e = window.event;
	var resize_pic = document.getElementById("image1");
	var container = document.getElementById("container");

	container.style.width = (e.clientX - container.offsetLeft) + "px";
	container.style.height = (e.clientY - container.offsetTop) + "px";

	resize_pic.style.width = container.style.width;
	resize_pic.style.height = container.style.height;

	if (e.stopPropagation) e.stopPropagation();
	else e.cancelBubble = true;
}

function upCorner(e) {
	if (!e) e = window.event;

	if (document.removeEventListener) {
		document.removeEventListener("mouseup",upCorner,true);
		document.removeEventListener("mousemove",moveCorner,true);
	}
	else if (document.detachEvent) {
		corner.detachEvent("onlosecapture",upCorner);
		corner.detachEvent("onmouseup",upCorner);
		corner.detachEvent("onmousemove",moveCorner);
		corner.releaseCapture();
	}

	if (e.stopPropagation) e.stopPropagation();
	else e.cancelBubble = true;
}

Для заказа дополнительных модулей, доработок и кастомизации данного скрипта - эл.адрес автора: freeden_codomaza@mail.ru