Draggable Divs

03-09-2005

Hi

I am trying to allow a user of a web site to move an image around the page
using draggable Divs. I have tried using some script from
http://www.mattkruse.com/.

In particular: http://www.mattkruse.com/javascript/dragiframe/ which caters
for draggable IFrames. I think I can use the same code for Divs but I have
no success as yet.

I have to following code but I can not work out what I am doing wrong.

<%@ Page Language="vb" AutoEventWireup="false" Codebehind="WebForm1.aspx.vb"
Inherits="ImageUpload.WebForm1"%>
<SCRIPT language=javascript src=dragiframe.js></SCRIPT>
<STYLE>.drag{position:absolute; cursor:hand;}</STYLE>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>WebForm1</TITLE>
</HEAD>

<BODY onLoad="addHandle(document.getElementsByTagName(Di v).item(0),
window);">
<DIV id="div1" name="div1" class="drag"
style="width:30;height:30;top:200;left:200">
<IMG src=cross.gif>
</DIV>
</BODY>
</HTML>

Can anybody identify where I am going wrong or if I am missing anything?

Regards, Carl

Note: I have also downloaded dragiframe.js and placed it in the same folder
as the web page.

03-09-2005

Without knowing what's in dragiframe.js it's hard to know what the
problem is. Try adding position: absolute in your div to allow it to
actually be positioned anywhere.

03-09-2005

Carl Gilbert wrote:
> Hi
>
> I am trying to allow a user of a web site to move an image around the page
> using draggable Divs. I have tried using some script from
> http://www.mattkruse.com/.
[...]

The script specifically looks for an IFRAME (see line 175).
You need to make it look for a div and manage the other parts of
the code that require an IFRAME not a div.

Maybe Matt is lurking?

Why not just use an IFRAME and be done with it?

--
Rob

03-09-2005

http://www.mattkruse.com/scripts/sup...&LastLogin=You
could also try posting on Matt's forum. Maybe someone has already done
it:

03-09-2005

Carl Gilbert wrote:
> Hi
>
> I am trying to allow a user of a web site to move an image around the
page
> using draggable Divs.

(snip)

This is hard to beat (check out the "Optional Commands" in particular).

http://www.walterzorn.com/dragdrop/dragdrop_e.htm

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
swapping divs -- when divs NOT positioned absolutely..	maya	Javascript	4	11-16-2007 05:11 PM
Managing divs within divs....	rich	HTML	0	02-02-2006 07:38 PM
Draggable window only works in MS JVM, and not Sun?	PilotYid	Java	4	12-28-2005 05:37 PM
Draggable window only works in MS JVM, and not Sun?	PilotYid	Java	0	12-27-2005 05:34 PM
resizable & draggable layers	Shailesh Humbad	HTML	1	08-03-2004 02:02 AM