So me some code brother, then I might be able to help ya
Tim Morford
http://www.aspalliance.com/tmorford
-----Original Message-----
From: tzhang@h... [mailto:tzhang@h...]
Sent: Monday, April 29, 2002 10:00 PM
To: javascript
Subject: [javascript] drag and drop over iFrame
Hi:
This is a DHTML question.
I have noticed a strange thing when I was trying to do a drag-and-drop on
my page which is full of iFrame. The object I am draging will follow the
cursor ONLY when the cursor enters the iFrame area FROM TOP-LEFT
QUADRANT!!! If the cursor enters the iFrame area from some other angles,
the object I am draging will get seperated from the cursor and will be
picked up when the cursor reaches the edge of iFrame.
Does anybody have any solutions on this?
Thanks!
Tim Zhang
The following is the code for you to see the situation in action:
*****************************************************************
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html><head><title>Untitled</title></head>
<script language="JavaScript">
var dragObject;
document.onmousedown = Document_OnMouseDown;
document.onmousemove = Document_OnMouseMove;
document.onmouseup = Document_OnMouseUp;
function Document_OnMouseDown(){
if (event.srcElement.drag == 'enable') {
dragObject = event.srcElement;
dragObject.style.position = 'absolute';
dragObject.style.pixelLeft = event.clientX +
document.body.scrollLeft;
dragObject.style.pixelTop = event.clientY +
document.body.scrollTop;
}
}
function Document_OnMouseMove(){
if (dragObject && dragObject.drag=='enable') {
dragObject.style.pixelLeft = event.clientX +
document.body.scrollLeft;
dragObject.style.pixelTop = event.clientY +
document.body.scrollTop;
}
}
function Document_OnMouseUp(){
if (dragObject && dragObject.drag=='enable') {
dragObject.style.pixelLeft = 300;
dragObject.style.pixelTop = 300;
dragObject = null;
}
}
</script>
<body>
this is test page for drag-and-drop with iFrame<br><br><br>
<div drag='enable' style="cursor:move; width:300; background:#ffffcc">drag
me over iFrame below please</div>
<br><br><br><br>
<iFrame width="200" height="200" src="iFrame1.html"></iframe>
</body></html>
***********************************************************************
---
Improve your web design skills with these new books from Glasshaus.
Usable Web Menus
http://www.amazon.com/exec/obidos/ASIN/1904151027/ref=nosim/theprogramme
r-20
Constructing Accessible Web Sites
http://www.amazon.com/exec/obidos/ASIN/1904151000/ref=nosim/theprogramme
r-20
Practical JavaScript for the Usable Web
http://www.amazon.com/exec/obidos/ASIN/1904151051/ref=nosim/theprogramme
r-20
View Cart
