Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Can web form perform drag and drop? 1
- Thread starter adonet
- Start date
-
1
- #2
Here is a small sample that will allow to drag and move a text box (works in IE). Drop it wherever you want 
.
.
Code:
<html>
<head>
<title>Drag and Drop</title>
</head>
<script language="javascript">
var DragEl, InitLeft, InitTop, PrevBorder;
var DragGrain = 1;
var DragSynch = false;
var intLeft = 10;
var intTop = 10;
if (document.all){
document.onmousedown = DragStart;
document.onmouseup = DragEnd;
document.onmousemove = DoDrag;
}
function DragStart()
{
el = event.srcElement;
if ( el.className == "dndWin" ) {
DragEl=el;
DragGrain=1;
while (DragEl.tagName != "DIV") DragEl = DragEl.parentElement;
InitLeft=event.clientX-DragEl.style.pixelLeft;
InitTop=event.clientY-DragEl.style.pixelTop;
DragSynch = false;
el.style.cursor = "move";
}
}
function DragEnd()
{
if ( DragEl ) {
DragEl = null;
el.style.cursor = "default";
}
}
function DoDrag(){
if(DragEl){
if ( DragSynch ) {
var newX = event.clientX;
var newY = event.clientY;
}
else {
var newX = event.clientX-InitLeft;
var newY = event.clientY-InitTop;
}
if ( (newX % DragGrain) == 0 )
DragEl.style.pixelLeft=newX;
if ( (newY % DragGrain) == 0 )
DragEl.style.pixelTop=newY;
return false;
}
}
</script>
<body bgcolor="#cccccc">
<center>
<div id="divDnD" position:absolute;left:550;top:100;">
<input type=text name="txtDnD" class="dndWin">
</div>
</center>
</body>
</html>- Thread starter
- #7
BoulderBum
Programmer
I want to do something like this for what I'm doing, too. Star from me.
BoulderBum
Programmer
Yeah, I'm learning the mouse event argument stuff is a little different for Netscape, etc., but it's a good demonstration of the concept at least.
- Status
Similar threads
- Locked
- Question
- Locked
- Question