PDA

Click to See Complete Forum and Search --> : How can I capture ONMOUSEDOWN and ONMOUSEUP

yphasukyued
12-09-2003, 01:22 PM
I got the JS for Dragging the image from some this forum.
How can I capture ONMOUSEDOWN and ONMOUSEUP from this JS and send them to ASP?

Here is the JS:

<html>
<head>
<title></title>
<style>
<!--
.drag{position:relative;cursor:hand}
-->
</style>
<script language="JavaScript1.2">
<!--

var ie=document.all
var ns6=document.getElementById&&!document.all

var dragapproved=false
var z,x,y

function move(e){
if (dragapproved){
z.style.left=ns6? temp1+e.clientX-x: temp1+event.clientX-x
z.style.top=ns6? temp2+e.clientY-y : temp2+event.clientY-y
return false
}
}

function drags(e){
if (!ie&&!ns6)
return
var firedobj=ns6? e.target : event.srcElement
var topelement=ns6? "HTML" : "BODY"

while (firedobj.tagName!=topelement&&firedobj.className!="drag"){
firedobj=ns6? firedobj.parentNode : firedobj.parentElement
}

if (firedobj.className=="drag"){
dragapproved=true
z=firedobj
temp1=parseInt(z.style.left+0)
temp2=parseInt(z.style.top+0)
x=ns6? e.clientX: event.clientX
y=ns6? e.clientY: event.clientY
document.onmousemove=move
return false
}
}
document.onmousedown=drags
document.onmouseup=new Function("dragapproved=false")

//-->
</script>

</head>

<body>
<form name=DragTest>
<input type="image" src="Portrait.jpg" class="drag">
</form>
</body>
</html>

Thanks

Yut
ray326
12-09-2003, 08:20 PM
. . .
if (dragapproved){
z.style.left=ns6? temp1+e.clientX-x: temp1+event.clientX-x
z.style.top=ns6? temp2+e.clientY-y : temp2+event.clientY-y
document.DragTest.xloc.value = z.style.left
document.DragTest.yloc.value = z.style.top
return false
. . .


. . .
<form name="DragTest">
<input type="image" src="Portrait.jpg" class="drag">
<input type="hidden" name="xloc" value="0">
<input type="hidden" name="yloc" value="0">
</form>
. . .

You can make those type="text" if you want to watch it work.
yphasukyued
12-10-2003, 07:46 AM
Thank you very much Ray326, it worked very nice. How can I get rid off "px", and how about ONMOUSEDOWN?

Thanks again for your help.

Yut
ray326
12-10-2003, 09:18 AM
Originally posted by yphasukyued
Thank you very much Ray326, it worked very nice. How can I get rid off "px", and how about ONMOUSEDOWN?

Thanks again for your help.

Yut
You can add a couple more fields and use a similar techique as above in the
if (firedobj.className=="drag"){
...}
section to grab the initial position. In fact that's what I did first because I didn't really want to take the time to understand all the code. 8-)

"Get rid of 'px'" I don't understand.
yphasukyued
12-10-2003, 11:23 AM
Thanks for quick replied Ray326. You are my life saver.

Yut
yphasukyued
12-11-2003, 01:22 PM
I forgot one more thing. How can I remove the "px" (for example resulted from ONMOUSEUP give me X=125px and Y=245px)

Thanks

yut
ray326
12-11-2003, 07:39 PM
E.g.

document.DragTest.xloc.value = z.style.left.replace(/px$/,"")
yphasukyued
12-12-2003, 07:15 AM
Thanks again Ray326, you are the best.

____
Yut