sto provando con connectWith, e sembra funzionare... ma ha uno strano comportamento: i blocchi vengono disposti in maniera apparentemente casuale :master:
Codice PHP:
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.base.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.sortable.js"></script>
<script type="text/javascript" src="http://dev.jquery.com/view/tags/ui/1.5b2/ui.draggable.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
$('#elenco1 .block').draggable({
cursor: 'move',
connectToSortable: '#target'
});
$('#target').sortable({
cursor: 'move',
connectWith: ['#elenco1']
});
});
</script>
<style type='text/css'>
#elenco1 {
float: left;
display: block;
height: 200px;
width: 100px;
background-color: #999;
}
.block {
display: block;
height: 20px;
width: 30px;
margin: 5px;
}
#target {
display: block;
vertical-align: top;
text-align: left;
margin-left: 150px;
height: 200px;
width: 100px;
background-color: #bdf;
}
</style>
</head>
<body>
<div id='elenco1'>
<div class='block' style='background-color:#aaa;'></div>
<div class='block' style='background-color:#ccc;'></div>
<div class='block' style='background-color:#eee;'></div>
</div>
<div id='target'></div>
</body>
</html>