Javascript Jquery动画可排序问题

我有两个列表，其中包含一些项目，必须从左向右拖动，并在右侧排序。我一直在努力将动画添加到列表中，但我不知道它是如何工作的。但是，如果您将一个项目从右侧拖动到左侧列表中，然后缓慢地将其拖出而不拖放，它将不会从左侧列表中出来（sortable2）。 另一个问题是，我不知道为什么占位符比原始项目大，为什么它有阴影？ 这是我的密码： ***Update：只是知道从LI中删除边距可以修复bug，但现在我需要修复中间的项目。有什么想法吗

$（函数（）{
美元（“#可排序1 li”）。可拖动({
光标：“移动”，光标：{top:50，left:40}，
connectToSortable:“.connectedSortable”，
助手：“克隆”，
回复：150，
删除：函数（事件、用户界面）{
ui.item.clone（）.appendTo（'#sortable2'）；
$（this）.draggable（'cancel'）；
}
}).disableSelection（）；
$（“#可排序2”）。可排序({
轴：“y”，
占位符：“幻灯片占位符”，
开始：功能（e、ui）{
占位符高度=ui.item.outerHeight（）；
ui.占位符.高度（占位符高度+15）；
$（''）.insertAfter（ui.placeholder）；
},
更改：功能（事件、用户界面）{
ui.placeholder.stop（）.height（0）.设置动画({
高度：ui.item.outerHeight（）+15
}, 300);
placeholder AnimatorHeight=parseInt（$（“.slide placeholder animator”）.attr（“数据高度”）；
$（“.slide placeholder animator”）.stop（）.height（placeholder animatorheight+15）。设置动画({
身高：0
}，300，函数（）{
$（this.remove（）；
占位符高度=ui.item.outerHeight（）；
$（''）.insertAfter（ui.placeholder）；
});
},
停止：功能（e、ui）{
$（“.slide placeholder animator”）.remove（）；
},
}).disableSelection（）；
});
#可排序1{列表样式类型：无；边距：自动；填充：0；浮点：右；}
#sortable2{列表样式类型：无；边距：自动；填充：0；浮点：左；最小高度：130px；宽度：130px；边框：1px纯黑；}
#可排序1 li，#可排序2 li{填充：5px；字体大小：1.2em；线条高度：100px；宽度：70px；高度：100px；边框半径：10%；颜色：#ffffffff；方框阴影：3px 3px 1px#8888888；}
.red{背景色：#ff3300；}
.blue{背景色：#1111ff；}
.black{背景色：#000000；}
.green{背景色：#00fd01；}
.yellow{背景色：#ffff66；}
.slide占位符{高度：100px；背景色：#DADADA；边框：1px点红色；-webkit框阴影：无；-moz框阴影：无；框阴影：无；}


第1项
第2项
第3项
第4项
第5项



这是问题后半部分的解决方案


$（函数（）{
美元（“#可排序1 li”）。可拖动({
光标：“移动”，
光标：{顶部：50，左侧：40}，
connectToSortable:“.connectedSortable”，
助手：“克隆”，
回复：150，
删除：函数（事件、用户界面）{
ui.item.clone（）.appendTo（'#sortable2'）；
$（this）.draggable（'cancel'）；
}
}).disableSelection（）；
$（“#可排序2”）。可排序({
轴：“y”，
占位符：“幻灯片占位符”，
开始：功能（e、ui）{
占位符高度=ui.item.outerHeight（）；
用户界面.占位符.高度（占位符高度-10）；
$（''）.insertAfter（ui.placeholder）；
},
更改：功能（事件、用户界面）{
ui.placeholder.stop（）.height（0）.设置动画({
高度：ui.item.outerHeight（）-10
}, 300);
placeholder AnimatorHeight=parseInt（$（“.slide placeholder animator”）.attr（“数据高度”）；
$（“.slide placeholder animator”）.stop（）.height（placeholder animatorheight-15）。设置动画({
身高：0
}，300，函数（）{
$（this.remove（）；
占位符高度=ui.item.outerHeight（）；
$（''）.insertAfter（ui.placeholder）；
});   
},
停止：功能（e、ui）{
$（“.slide placeholder animator”）.remove（）；
},
}).disableSelection（）；
});
#可排序1{
列表样式类型：无；
保证金：自动；
填充：0；
浮动：对；
}
#可排序的2{
列表样式类型：无；
保证金：自动；
填充：0；
浮动：左；
最小高度：130px；
宽度：130px；
边框：1px纯黑；
}
.ui状态默认值{
利润率：10px29px；
填充物：5px；
字体大小：1.2米；
线高：100px；
宽度：70px；
高度：100px；
边界半径：10%；
颜色：#ffffff；
盒影：3px 3px 1px#8888888；
}
瑞德先生{
背景色：#ff3300；
}
蓝先生{
背景色：#1111ff；
}
布莱克先生{
背景色：#000000；
}
格林先生{
背景色：#00fd01；
}
黄色{
背景色：#ffff66；
}
.幻灯片占位符{
利润率：10px29px；
填充物：5px；
字体大小：1.2米；
线高：100px；
宽度：70px；
高度：100px；
边界半径：10%；
背景色：#达达达；
边框：1px点红色；
-webkit盒阴影：无；
-莫兹盒阴影：无；
盒影：无；
}


第1项
第2项
第3项
第4项
第5项


我得到一个错误：
对象不支持属性或方法“draggable”
@NinaScholz是的，我也看不出代码在我的P上工作的原因