jquery ui draggable scroll auto

Question

我想在一个具有固定高度和宽度的容器上实现draggable，但是需要滚动模仿无限表面。

这是css

.drag {
    width: 100px;
    height: 100px;
    border: 1px solid black;
    cursor: pointer;
    border-radius: 10px;
    text-algin: center;
    background-color: lightpink;
}

这是html。 Box是具有固定宽度和高度但具有自动溢出的容器。

<div id="box" style="width:500px;height:300px;border:1px solid black;background-color:lightgreen;overflow:auto;">
    <div id="dragx" class="drag"><p>Drag me</p></div>
</div>

这是javascript。

$(function () {
    $("div[id='dragx']").draggable({
        containment: "#box",
        scroll: true
    });
});

可以在http://jsbin.com/tafof/2/edit?html,output

找到完整的示例

基本上当我将div拖到极端向下或极右时，我希望滚动条显示并允许我尽可能地拖动。但目前它不允许我拖出固定的宽度和高度。

当我拖到极致时，我需要做什么才能按需显示滚动条？

Answer 1

你需要#box有溢出：滚动属性而不是自动。