Home › 3_2004-2005 › Drag and Drop Layer
Advertisement
3_2004-2005 Layers #145169

Drag and Drop Layer

A Madarum
★★★★★
4.8 · Downloads: 2,341

You can drag and drop layer as virtual window in your page

AI

AI Summary: This codebase represents a historical implementation of the logic described in the metadata. Our preservation engine analyzes the structure to provide context for modern developers.

Source Code
original-source 
<HTML>
<HEAD><TITLE>Drag and Drop Layers</TITLE>
<SCRIPT LANGUAGE=JAVASCRIPT>
/*
* Name: Drag and Drop Layers
* Description:Drag and drop virtual window on your page
*
* note:
* i just test it in ie 5 and opera 6
* it can't work in netscape yet
* last modified 4/9/2002 12:57PM
*/
is_opera = (navigator.userAgent.toLowerCase().indexOf("opera") != -1);
var curObj = null; /* current object wich be drag */
var mouseY = 0;	/* mouse X */
var moousX = 0;	/* mouse Y */
var dx = 0;
var dy = 0;

function dragThis(what){
  var tmp;
  alert(what);
  if (document.all) tmp = document.all[what].style;
  else if (document.getElementById) tmp = document.getElementById(what).style;
  else if (document.layers) tmp=document.layers[what];
  
  curObj = tmp;
  var str = "";
  var i=0;
  str = tmp.left;	/* in ie style.left="12px" and in opere style.left="12" */
  i= (!is_opera) ? str.substr(0,str.length-2) : str;
  dx = mouseX - i;
  str = tmp.top;
  i= (!is_opera) ? str.substr(0,str.length-2) : str;
	dy = mouseY - i;
}

function mouseMove(e){
  mouseX = (document.all)? event.clientX : e.x;
  mouseY = (document.all)? event.clientY : e.y;
	if (curObj){
    curObj.left= mouseX - dx;
  	curObj.top = mouseY - dy;
	}
}

function mouseUp() {
	curObj = null;
}

if (document.layers)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=mouseMove;
document.onmouseup=mouseUp;
</SCRIPT>
</HEAD>
<BODY>
  
  <!------------- start layer ------------------>
  <script>
  	var tag="div";
  	if (document.layers) tag = "layer";
  	document.write("<"+tag+" id=\"winDrag\" style=\"position:absolute\">");
  </script>
  <TABLE><TR><TD bgcolor=000000>
  <TABLE bgcolor=ffffff><TR bgcolor=dcdcdc onmousedown="dragThis('winDrag')"><TD>X</TD></TR>
  <TR bgcolor=ffcccc><TD>
  <TABLE><TR><TD nowrap>Drag on the baner above<BR>by <CODE>xMadda</CODE></TD></TR></TABLE>
  </TD></TR></TABLE></TD></TR></TABLE>
  <script>
  	document.write("</"+tag+">");
  </script>
  <!------------- end layer -------------------->
  
</BODY>
</HTML>
Original Comments (3)
Recovered from Wayback Machine