test1
HTML
<div id="red">
<div id="box_green" class="green"></div>
</div>
CSS
div#red {
width:500px;
height:200px;
position:relative;
alignment:center;
border:solid 1px black;
background-color:#F88;
}
div.green{
width:100px;
height:50px;
border:1px solid black;
background-color:#0f0;
cursor:pointer;
position:absolute;
}
JavaScript
$(document).ready(function(){
$('.green').draggable({opacity:'1', helper:'clone'});
$('#red').droppable({drop:dropped});
});
function dropped(ev, info) {
var relX = ev.clientX;
var relY = ev.clientY;
$(info.draggable)
.clone()
.css({
"left": relX-50,
"top" : relY-25
})
.prependTo('#red');
}