我在这里创建了一个演示。
代码:
//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%;
}
在那,当我将任何框向下拖动时,它会滚动很长时间并移出其他框。但是当我向上拖动任何框时,它可以正常工作。
那么,有什么办法可以防止它长时间向下滚动?