...

View Full Version : Click and Drag



d11wtq
02-06-2005, 04:56 PM
I'm looking to add a drop/drop feature to one of my pages... but firstly, just to get my head around the idea of capturing events I'd like to know how to do this simple thing.

It's easy to have onMouseover events for an element but how do I make it so that onMousover only works if the mouse button is depressed. So it's kinda like onMouseover -> if (MOUSEDOWN) -> Do something.

Thanks for any help :-)

hemebond
02-06-2005, 09:28 PM
http://www.walterzorn.com/dragdrop/dragdrop_e.htm

d11wtq
02-07-2005, 01:51 AM
That's great thanks but what I actually want at the moment is a check that two simultaneous events are occurring (onMouseover and onMousedown)... can I do that?

hemebond
02-07-2005, 02:55 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>51755</title>
<style type="text/css">
#box
{
width:200px;
height:200px;
background-color:#f00;
}
</style>
</head>
<body>
<div id="box"></div>
<p> </p>
<script type="text/javascript">
var mousedown = false;

var body = document.getElementsByTagName("body")[0];
body.addEventListener("mousedown", function(){mousedown = true}, true);
body.addEventListener("mouseup", function(){mousedown = false}, true);

var box = document.getElementById("box");
box.addEventListener("mouseover", function(){if(mousedown)alert("mousedown & mouseover")}, true);
</script>
</body>
</html>

d11wtq
02-07-2005, 10:47 PM
Nice one thanks I'll take a closer look and see how it works. I notice it only works in Mozilla not IE... is this just an IE issue?

hemebond
02-08-2005, 02:48 AM
IE doesn't support addEventListener (which is part of the spec). You'll need to add an IE specific method to get around this. Something like
body.onmousedown = function(){mousedown = true}

d11wtq
02-08-2005, 10:24 PM
Trust Mr Gates to stick with the guidelines ;) Thanks very much you've been a really big help..



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum