Разместване на DIV-чета като при CPanel

DJCharge

Registered
Забелязах, че в CPanel-а ми мога да си размествам кутийките (също и минимизирам) и при следващото влизане помни подреждането от предния път .. та трябва ми нещо подобно :) стига ми само да мога да ги местя.

EDIT: да е без MySql или Ajax ..
 
за местенето от тук си го изсмукай :-) става и с всичко друго, не само картинки.

http://www.puremango.co.uk/3dcube.html на JS е
 
Мисля че имаше в предвид като се разместят нещата, и като рефрешнеш страницата, да са си се запазили както си си ги наредил.
 
НЕ искам да се местят където ти скимне и също така приемаме, че си имат вече зададена позиция.. искам да може да ги разбъркваш и евентуално да се запомня в бисквитка позицията на всички.

Примерно:

Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>BASIC DRAG-AND-DROP DIVS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script language="javascript">
// start dragging
function startDrag(e){
	// determine event object
	if(!e){var e=window.event};
	// determine target element
	var targ=e.target?e.target:e.srcElement;
	if(targ.className!='draggable'){return};
	// calculate event X,Y coordinates
    offsetX=e.clientX;
    offsetY=e.clientY;
	// assign default values for top and left properties
	if(!targ.style.left){targ.style.left='0px'};
	if(!targ.style.top){targ.style.top='0px'};
	// calculate integer values for top and left properties
    coordX=parseInt(targ.style.left);
    coordY=parseInt(targ.style.top);
    drag=true;
	// move div element
    document.onmousemove=dragDiv;
}
// continue dragging
function dragDiv(e){
	if(!drag){return};
	if(!e){var e=window.event};
	var targ=e.target?e.target:e.srcElement;
	// move div element
  	targ.style.left=coordX+e.clientX-offsetX+'px';
  	targ.style.top=coordY+e.clientY-offsetY+'px';
  	return false;
}
// stop dragging
function stopDrag(){
	drag=false;
}
window.onload=function(){
	document.onmousedown=startDrag;
	document.onmouseup=stopDrag;
}
</script>
<style type="text/css">
.draggable {
	position: relative;
        font-family: verdana;
        font-size: 11px;
	width: 250px;
	height: 100px;
	background-color: #ccc;
	border: 1px solid #000;
        margin-bottom: 3px;
        padding: 3px;
        cursor: move;
}
</style>
</head>
<body>
<div class="draggable">#1 This is a dragging DIV element</div>
<div class="draggable">#2 This is a dragging DIV element</div>
</body>
</html>

Ето тези може да се местят, но където ти скинме :roll: а аз искам да може само да им сменяш местата ... точно така както са първоначално.

Примерно хващаш долния DIV и го пускаш в/у (но малко над) другия див и те се разместват! :lol:
 

Back
Горе