Salve vi illustro cosa vorrei realizzare e poi dove sono arrivato ad impantanarmi:
3 div contenitori ognuno allinterno di un proprio div "box" solo il contenitore si sposta e puo andare dentro un altro box ma a quel punto il contenitore dell'altro box deve andare al posto dell'altro.
Ossia se io sposto il contenitore1 nel box2 nello stesso istante il contenitore2 deve andare nel box1
Spero di essermi spiegato....vi posto tutto il codice
<!DOCTYPE HTML>
<html>
<head>
<style>
.box-1{
position:absolute;
left:50px;
top:27px;
border:2px solid #900;
padding:0.4em;
width:116px;
background-color:#fafafa;
color: #900;
}
.box-2{
position:absolute;
left:212px;
top:27px;
border:2px solid #900;
padding:0.4em;
width:147px;
background-color:#fafafa;
color: #900;
}
.box-3{
position:absolute;
left:405px;
top:27px;
border:2px solid #900;
padding:0.4em;
width:170px;
background-color:#fafafa;
color: #900;
}
#drag11{
width:100px;
height:20px;
position:relative;
background-color:red;
}
#drag21{
width:100px;
height:20px;
position:relative;
background-color:blue;
}
#drag31{
width:100px;
height:20px;
position:relative;
background-color:green;
}
</style>
<script>
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("<div>", ev.target.id);
}
function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("<div>");
ev.target.appendChild(document.getElementById(data ));
}
window.addEvent('domready', function () {
$('#draggables div').each(function (drag) {
new Drag.Move(drag);
});
});
</script>
</head>
<body>
<div class="box-1">
<div id="drag11" draggable="true" ondragstart="drag(event)" ondrop="drop(event)" ondragover="allowDrop(event)">contenitore1 </div>
</div>
<div class="box-2" >
<div id="drag21" draggable="true" ondragstart="drag(event)" ondrop="drop(event)" ondragover="allowDrop(event)">contenitore2</div>
</div>
<div class="box-3">
<div id="drag31" draggable="true" ondragstart="drag(event)" ondrop="drop(event)" ondragover="allowDrop(event)">contenitore3</div>
</div>
</body>
</html>
Rispondi quotando