snap-to(吸附移动)：
jQuery("#draggable1").draggable({snap:true});//默认，任何方式吸附
jQuery("#draggable2").draggable({snap:"#snaptarget"});//以某元素的内外径吸附
jQuery("#draggable3").draggable({snap:"#snaptarget",snapMode:"outer"});//以某元素外径吸附，吸附方式：本上吸其下，本下吸其上
jQuery("#draggable4").draggable({grid:[20,20]});//以一定的距离移动
jQuery("#draggable5").draggable({grid:[80,80]});
源代码-html代码：
<html>
<head>
<link rel = "stylesheet" href = "jquery.ui.all.css">
<script type = "text/javascript" src = "jquery-1.4.2.min.js"></script>
<script type = "text/javascript" src = "jquery.ui.core.js"></script>
<script type = "text/javascript" src = "jquery.ui.widget.js"></script>
<script type = "text/javascript" src = "jquery.ui.mouse.js"></script>
<script type = "text/javascript" src = "jquery.ui.draggable.js"></script>
<link rel = "stylesheet" href = "demos.css">
<script type = "text/javascript">
jQuery(document).ready(function(){
jQuery("#draggable1").draggable({snap:true});//默认，任何方式吸附
jQuery("#draggable2").draggable({snap:"#snaptarget"});//以某元素的内外径吸附
jQuery("#draggable3").draggable({snap:"#snaptarget",snapMode:"outer"});//以某元素外径吸附，吸附方式：本上吸其下，本下吸其上
jQuery("#draggable4").draggable({grid:[20,20]});//以一定的距离移动
jQuery("#draggable5").draggable({grid:[80,80]});
});
</script>
<style>
#snaptarget{
height:150px;
}
.ui-widget-header p{
margin:0;
}
#draggable1,#draggable2,#draggable3,#draggable4,#draggable5{
height:80px;
width:90px;
padding:0.5em;
float:left;
margin:0px 10px 10px 0px;
}
</style>
</head>
<body>
<div class = "demo">
<div id = "snaptarget" class = "ui-widget-header">
<p>a snap target</p>
</div>
<br clear = "both"/>
<div id = "draggable1" class = "ui-widget-content">
<p>默认吸附方式</p>
</div>
<div id = "draggable2" class = "ui-widget-content">
<p>以某元素的内外径吸附</p>
</div>
<div id = "draggable3" class = "ui-widget-content">
<p>以某元素外径吸附</p>
</div>
<div id = "draggable4" class = "ui-widget-content">
<p>以一定的距离移动：grid:[20,20]</p>
</div>
<div id = "draggable5" class = "ui-widget-content">
<p>以一定的距离移动：grid:[80,80]</p>
</div>
</div>
</body>
</html>
PS：对jQuery("#draggable3").draggable({snap:"#snaptarget",snapMode:"outer"});//以某元素外径吸附，吸附方式：本上吸其下，本下吸其上的理解：id
为“draggable3”的可拖拽容器以id为“snaptarget”的容器的外径吸附。即draggable3在snaptarget上
时，draggable3的下边框与snaptarget的上边框吸附，当draggable3在snaptarget下时，draggable3的上边
框与snaptarget的下边框吸附。