jquery - Jquery UI Sortable - Divスクロールの問題

Question

ここでデモを作成しました。

コード：

//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%;
}

その中で、任意のボックスを下にドラッグすると、非常に長くスクロールして他のボックスから移動します。しかし、ボックスを上にドラッグすると、正しく機能します。

それで、それが長くスクロールダウンするのを防ぐ方法はありますか?