Javascript 拖动时，div位于另一个div的顶部

我有两个div，具有jquery可调整大小和可拖动的特性，它们工作得很好。我的问题是，在使用这两个div时，如何使它们相互重叠。现在要详细说明的是，第2帧始终位于第1帧的顶部，当我将其拖动到第2帧上时，如何使第1帧位于第2帧的顶部，当它被拖动到第1帧上时，如何使第2帧位于第1帧的顶部。这可能吗？类似于活动状态下的

。感谢您的帮助。提前谢谢


jQuery（$=>{
设$framewrap1=$（'.framewrap1'）；
$framewrap1
.可调整大小({
手柄：“北、东、南、西、西南、东南、西北、东北”
})
.拖拉({
});
});
jQuery（$=>{
设$framewrap2=$（'.framewrap2'）；
$framewrap2
.可调整大小({
手柄：“北、东、南、西、西南、东南、西北、东北”
})
.拖拉({
});
});
.framewrap1{
背景颜色：绿色；
宽度：150px；
高度：150像素；
位置：绝对位置；
右：0%
}
.framewrap2{
背景颜色：棕色；
宽度：150px；
高度：150像素；
位置：绝对位置；
左：20%
}