JavaScript: как динамически перемещать Div, щелкая и перетаскивая ⇐ Html

[Anonymous]

Хорошо, казалось бы, все должно быть просто. Мне нужно взять уже существующий элемент div и переместить его в соответствии с положением мыши в окне. Я искал повсюду, и это привело меня к слишком сложным способам выполнения одного и того же, включая использование j-запроса. Мне нужно строго использовать JavaScript для того, что я пытаюсь сделать.

Метод:

var mousePosition;
var div;

(function createDiv(){

div = document.createElement("div");
div.style.position = "absolute";
div.style.left = "0px";
div.style.top = "0px";
div.style.width = "100px";
div.style.height = "100px";
div.style.background = "red";
div.style.color = "blue";

div.addEventListener('mousedown', handleKeyPressed, true);

document.body.appendChild(div);

})();

function handleKeyPressed(event) {

event.preventDefault();

mousePosition = {

x : event.clientX,
y : event.clientY

};

div.style.left = mousePosition.x;
div.style.top = mousePosition.y;

//alert("whoa!");

}


Подробнее здесь: https://stackoverflow.com/questions/240 ... d-dragging