jQuery UI

要素の並べ替えとドラッグ＆ドロップ●親要素の表示領域から外に出さない様にする

$('div#ex1').draggable({containment:'parent'});

CSS設定

.ui-sortable{cursor:move;}           /*マウスカーソルの形状を変更*/
.ui-sortable-disabled{cursor:auto;}  /*マウスカーソルの形状を変更*/
div#parent{width:150px; height:150px; background-color: #cf9;}
div#ex1{width: 100px; height: 100px; background-color: #fc9;}

<div id="parent">
<div id="ex1">ドラッグされる要素</div>
</div>