function down(event){
event.target.style.backgroundColor="green";
document.addEventListener("mousemove",move,false);
}
function up(event) {
event.target.style.backgroundColor="red";
document.removeEventListener("mousemove",move,false);
}
function move(event) {
event.target.style.left=Math.max(0,Math.min(window.innerWidth-50,event.clientX-25))+"px";
event.target.style.top=Math.max(0,Math.min(window.innerHeight-50,event.clientY-25))+"px";
}
For the complete code, you can visit ->
http://jsfiddle.net/tcubsfbg/1/
I have noticed that when I move the mouse too quickly, the box does not update its position as fast as my mouse movement. It seems like despite adding mouse move events to the window and even with the document, the issue persists.