topical media & game development
professional-javascript-13-SimulatedDragAndDropExample2.htm / htm
<html>
<head>
<title>Simulated Drag And Drop Example</title>
<script type="text/javascript" src="eventutil.js"></script>
<script type="text/javascript">
function handleMouseMove() {
var oEvent = EventUtil.getEvent();
var oDiv = document.getElementById("div1");
oDiv.style.left = oEvent.clientX;
oDiv.style.top = oEvent.clientY;
}
function handleMouseDown() {
EventUtil.addEventHandler(document.body, "mousemove", handleMouseMove);
EventUtil.addEventHandler(document.body, "mouseup", handleMouseUp);
}
function handleMouseUp() {
EventUtil.removeEventHandler(document.body, "mousemove", handleMouseMove);
EventUtil.removeEventHandler(document.body, "mouseup", handleMouseUp);
}
</script>
<style type="text/css">
#div1 {
background-color: red;
height: 100px;
width: 100px;
position: absolute;
}
</style>
</head>
<body>
<p>Try dragging the red square.</p>
<p><div id="div1" onmousedown="handleMouseDown()"></div> </p>
</body>
</html>
(C) Æliens
20/2/2008
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.