Jquery UI Sortable - Div 滚动问题答案

【问题标题】：Jquery UI Sortable - Div scroll issueJquery UI Sortable - Div 滚动问题
【发布时间】：2013-07-23 10:35:23
【问题描述】：

我创建了一个演示here。

代码：

//Javascript

$(function() {
    $("#panel").sortable({
        items: ".content",
        axis:"y",
        scroll:true,
    }).disableSelection();

});

//HTML

<ul id="panel" class="scroll">
    <li class="content" style="background-color:red">item1</li>
    <li class="content" style="background-color:green">item2</li>
    <li class="content" style="background-color:blue">item3</li>
    <li class="content" style="background-color:gray">item4</li>
    <li class="content" style="background-color:yellow">item5</li>
    <li class="content" style="background-color:green">item6</li>
    <li class="content" style="background-color:yellow">item7</li>
    <li class="content" style="background-color:red">item8</li>    
</ul>

//CSS

.scroll{
    overflow:scroll;
    border:1px solid red;
    height: 200px;
    width: 150px;
    position:relative;
}
.content{
    height: 50px;
    width: 100%;
}

其中，当我将任意框向下拖动时，它会滚动很长时间并移出其他框。但是当我将任何框向上拖动时，它可以正常工作。

那么，有什么办法可以防止它长时间向下滚动？

【问题讨论】：

标签： jquery jquery-ui jquery-ui-sortable

【解决方案1】：

像这样改变你的样式表：

.scroll {
    border: 1px solid red;
    height: 200px;
    overflow: auto;
    position: static;
    width: 150px;
}

并在您的ul 上方使用此代码：

<div style="overflow:hidden;width:150px;height:200px;position:relative">

【讨论】：

但是 Draggable 项移出框（

【解决方案2】：

这并没有多大帮助，但是如果您检查 jQuery UI documentation，您会发现问题也出现在那里。我假设这是一个错误。

【讨论】：