Javascript 如何预防jQueryUI'；通过页面上的某个偏移量进行的可拖动交互是什么？

我正在使用jQueryUI（最新版本）。我们的页面上有一个类似于JSFIDLE的分隔条。它只能沿x轴拖动，但我们遇到的问题是让它停在某个点上

当该条到达窗口任意边缘的250px范围内时，我们希望它停止。我确实找到了这个“解决方案”，但它对我们并不真正有效：

在jQueryUI中的拖动事件中，调用stopDraging（）：

function stopDragging() {

    console.log( $('#dragbar').offset().left );

    if ( $('#dragbar').offset().left < 250 )
    {
        $('#dragbar').trigger('mouseup');
    }
}

此方法还可以释放拖动栏上的鼠标抓取。我希望这种行为是这样的，如果用户拖到这一点，他们就不能再拖了——如果他们不释放点击并以另一种方式拖动，它仍然可以工作

更新

看这把小提琴的例子。拖动时，绿色和蓝色将相应调整大小

更新2

我制作这把小提琴是为了更接近最终结果。当我按照@ntgCleaner的建议添加边距时，它会更改条的位置

---

多亏了ntgCleaner，我才能够解决这个问题。我没有使用他的解决方案，但他确实让我走上了正确的方向

在这里演奏小提琴：

我所做的是使用

$.resizeable（）

。这让我能够灵活地控制它可以走多小或多宽，同时选择我想要拖拽的边缘

我能够使用我的

dragbar

元素作为小部件的句柄，一切都很好

---

感谢所有参与的人

在控制台中查找stacktrace，看看哪一行（在代码中）是罪魁祸首。您是否尝试过创建一个两边都有250px边距的容器，然后将该容器设置为可拖动的“容器”？您还可以给正在拖动的元素一个250px的边距，它应该“计数”为整个DragableFrits-错误在jqueryui.jsntgCleaner中：这不是一个真正的选项，因为我在拖动条的两侧有两个宽度百分比的div。该条相应地调整其宽度。250px是常数吗？或者这也会随着屏幕的大小而调整吗？不知道你是否看过我上面评论的后半部分（后来编辑），在拖拽表上加了250px的边距？

Uncaught TypeError: Cannot read property '0' of null