我正在使用 jQuery UI（最新版本）。我们的页面上有一个类似于 jsfiddle 的分隔栏。它只能沿 x 轴拖动，但我们遇到的问题是让它停在某个点。
当栏到达窗口任一边缘的 250 像素以内时，我们希望它停止。我确实找到了这个“解决方案”，但它并不适合我们：
在 jQueryUI 中的拖动事件中，调用 stopDragging()：
function stopDragging() {
console.log( $('#dragbar').offset().left );
if ( $('#dragbar').offset().left < 250 )
{
$('#dragbar').trigger('mouseup');
}
}
但是，这会引发错误：
Uncaught TypeError: Cannot read property '0' of null
此方法还释放鼠标在拖动条上的抓握。我希望这种行为是这样的，如果用户拖动到这一点，他们不能再拖动它 - 如果他们不释放点击并以另一种方式拖动，它仍然可以工作。
更新
有关示例，请参见此小提琴。拖动时，绿色和蓝色将相应调整大小。
更新 2
我创建这个小提琴是为了更接近最终结果。当我按照@ntgCleaner 的建议添加边距时，它会更改栏的位置。