Well, the basic idea is quite simple, but how involved it gets depends on what you're trying to do. The script supports a onDragEnd event that gives you access to the last known x and y position of the dragged element when the user's mouse button is back up:
<div id="mydiv" style="position: relative; width: 100px; height: 100px; background-color: lightyellow; border: 1px solid black; padding: 3px; z-index: 100">
Drag me!
</div>
<script type="text/javascript">
var mydiv=document.getElementById("mydiv")
Drag.init(mydiv)
mydiv.onDragEnd=function(x, y){
alert(x+" "+y)
}
</script>
In this example, the x,y coordinates is alerted whenever the user finishes dragging. The idea is then to save these numbers into the user's browser cookies, something like:
<script type="text/javascript">
var mydiv=document.getElementById("mydiv")
Drag.init(mydiv)
mydiv.onDragEnd=function(x, y){
setCookie("mydiv", x+"||"+y, 30)
}
function getCookie(Name){
var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair
if (document.cookie.match(re)) //if cookie found
return document.cookie.match(re)[0].split("=")[1] //return its value
return ""
}
function setCookie(name, value, days){
var expireDate = new Date()
//set "expstring" to either an explicit date (past or future)
var expstring=expireDate.setDate(expireDate.getDate()+parseInt(days))
document.cookie = name+"="+value+"; expires="+expireDate.toGMTString()+"; path=/"
}
</script>
Finally, the cookie now contains the last known coordinates for the dragged element "mydiv":
alert(getCookie("mydiv"))
That's the basic idea.
Thanks, but just 3 last things. The next time the same user opens that page, will it automaticly open the cookies, so that the divs will go into position?
Also, where do i put the
alert(getCookie("mydiv"))?
And lastly, is it possible to make this: http://www.dynamicdrive.com/dynamicindex17/animatedcollapse.htm draggable?
Thank you so much, whoever answers these :D