Important alert: (current site time 7/15/2013 1:10:59 PM EDT)
 

VB icon

Drag and Drop Layer

Email
Submitted on: 4/4/2002 12:16:23 PM
By: A Madarum  
Level: Intermediate
User Rating: By 7 Users
Compatibility: JavaScript
Views: 12982
(About the author)
 
     You can drag and drop layer as virtual window in your page
 
code:
Can't Copy and Paste this?
Click here for a copy-and-paste friendly version of this code!
 
Terms of Agreement:   
By using this code, you agree to the following terms...   
  1. You may use this code in your own programs (and may compile it into a program and distribute it in compiled format for languages that allow it) freely and with no charge.
  2. You MAY NOT redistribute this code (for example to a web site) without written permission from the original author. Failure to do so is a violation of copyright laws.   
  3. You may link to this code from another website, but ONLY if it is not wrapped in a frame. 
  4. You will abide by any additional copyright restrictions which the author may have placed in the code or code's description.
				
'**************************************
' Name: Drag and Drop Layer
' Description:You can drag and drop layer as virtual window in your page
' By: A Madarum
'
'This code is copyrighted and has' limited warranties.Please see http://www.Planet-Source-Code.com/vb/scripts/ShowCode.asp?txtCodeId=2793&lngWId=14'for details.'**************************************

<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>


Report Bad Submission
Use this form to tell us if this entry should be deleted (i.e contains no code, is a virus, etc.).
This submission should be removed because:

Your Vote

What do you think of this code (in the Intermediate category)?
(The code with your highest vote will win this month's coding contest!)
Excellent  Good  Average  Below Average  Poor (See voting log ...)
 

Other User Comments

4/4/2002 10:44:48 PMTuxer

That's quite good. It's short but usefull. But i think you should work on it again coz sometime after you hold down the mouse too long you'll find that it's follow the mouse without dragging it.
(If this comment was disrespectful, please report it.)

 

Add Your Feedback
Your feedback will be posted below and an email sent to the author. Please remember that the author was kind enough to share this with you, so any criticisms must be stated politely, or they will be deleted. (For feedback not related to this particular code, please click here instead.)
 

To post feedback, first please login.