Log in

View Full Version : Dom Drag & Drop for navigation?


celticchrys
07-29-2007, 04:15 AM
1) Script Title: Dom Drag & Drop

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex11/domdrag/

3) Describe problem:

Hello all. I'm using this script to make objects moveable on a page. I would like to somehow attach a URL to a draggable item. Then I want to be able to drag this onto a target, and when dropped on the target, load the URL in the browser. So, the idea is to have a group of moveable objects with URLS on the page, and when any of them are dropped on a target, thier URL will load.

I would appreciate any help.
jscheuer1
07-29-2007, 05:01 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title>Drop Navigation Demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="dom-drag.js"></script>
<style type="text/css">
body {
margin:0;
padding:0;
}
</style>
</head>
<body>
<div style="position:absolute;top:250px;left:250px;width:55px;height:55px;border:1px solid red;font-size:60%;font-family:sans-serif;">
Drop Links Here to go to Them!</div>
<div id="example" style="position: relative;width:50px;height:50px;border:1px solid black;">
Hi<br><a href="http://www.dynamicdrive.com/" onclick="return false;">DD</a></div>

<script type="text/javascript">
var blah=document.getElementById("example")
Drag.init(blah);
blah.onDragEnd=function(x,y){if(x>250&&x<260&&y>250&&y<260){window.location.href=blah.getElementsByTagName('a')[0].href}};
</script>
</body>
</html>
celticchrys
07-30-2007, 12:50 PM
John,
Thank you, sincerely! This is just what I needed. I truly appreciate the help!
-Chrys