Jquery 绝对位置元素内的固定位置元素

我在一些元素上使用jQueryUIDragable和Reshable，但是有时候内容对于元素来说太大了，我希望它滚动

我已经成功地使用H3元素实现了预期的效果，因为无论您在何处拖动或调整大小，H3元素都会保持在原位（尽管关于如何使其不覆盖滚动条的任何提示都很重要！）

但是，当尝试在可拖动和可调整大小的ui元素上执行此操作时，它们会转到整个文档窗口（我理解预期的web行为）。我用蓝色背景在小提琴上注释了这个

基本上，当你向下/向上滚动时，我希望拖动和调整大小手柄保持在右下角，但我似乎无法实现

见此：

$（'.panel'）。每个（函数（）{
$（此）。可拖动({
句柄：“h3”，
包含：'父'，
快照：是的
});
$（此）。可调整大小({
包含：'父'，
身高：100，
最小宽度：200
});
//使标题固定且全宽
var h3=$（this.children（'h3'）；
var content=$（this.children（'.panelcontent'）；
h3.宽度（h3.宽度（））；
h3.css（‘位置’、‘固定’）；
content.css（'margin-top'，h3.outerHeight（true）+'px'）；
$（this）.on（'resize'，函数（事件，用户界面）{
var me=$（此）；
var myh3=me.children（'h3'）；
myh3.外层宽度（me.innerWidth（））；
});
});
html，
身体{
身高：90%；
宽度：90%；
}
身体{
字体大小：62.5%
}
#区域{
宽度：100%；
身高：100%；
边框：1px实心#000；
位置：相对位置；
}
.小组{
宽度：200px；
高度：100px；
背景色：#ccc；
溢出：自动；
位置：绝对位置；
}
h3{
背景色：#ff6600；
光标：移动；
保证金：0；
字号：1.5em；
填充物：5px；
}
.panelcontent{
填充物：5px；
字体大小：1.1米；
}
#小组2{
左：50%；
最高：50%；
}
#panel2.ui可调整大小的句柄{
位置：固定；
背景色：rgba（0,0,255,0.5）；
}
.ui-可调整大小-e{
右：0！重要；
}
.ui-resizable-s{
底部：0！重要；
}

小组1
Lorem ipsum dolor sit amet，是一位杰出的献身者。拍卖人feugiat rutrum vitae quam中的Donec和nibh。莫比·索达莱斯（Morbi sodales）是奥古斯·内克·托托（tortor suscipit Dignessim）的权威。库拉比图尔·奥奇·胡斯托、普尔维纳·埃利芬德和弗林利亚·尼西。库拉比图尔
阿迪皮斯瓦里乌斯。
小组2
马蹄莲。在一次酒后驾车。仅在车辆速度时，停止同侧肢体运动。在乌拉姆科珀·尼布（ullamcorper nibh）的演讲中，我坐在了阿梅特·维韦拉（amet viverra）的旁边。枕下节拍。无便利。海扇藻
varius，sollicitudin lorem ac，hendrerit mi。
我更新了小提琴：

请看本节，我使用scroll（）和scrollTop（）函数重新定位调整大小图标：

    $('.panel').scroll(function(){
      var fromTop = $('.panel').scrollTop();
      $(this).find('.ui-resizable-se').css({
        marginBottom: '-'+fromTop+'px'
      });
    });

这比我提出的决议高得多！我强迫它用保证金修正仓位。Chrome和IE都不喜欢它，需要更多的黑客攻击。我将在我的网站上试用，并确认它解决了我的问题：）