2

是否可以在拖动容器边缘的项目时使完美滚动条自动向上/向下滚动?在这种拖放的情况下,我使用的是SortableJS

要重现我的用例,请尝试将第 1 项拖到列表的末尾(在第 8 项之后):https ://jsfiddle.net/hfalucas/fwzcse9k/5/

在第一个列表中,您不能拖动项目,因为滚动根本不移动

// js file
var ps = new PerfectScrollbar('.container');


Sortable.create(list, {
  animation: 150,
});


// httml
<div id="coisas" class="container">
  <div id="list" class="list-group content">
      <div class="list-group-item">1</div>
      <div class="list-group-item">2</div>
      <div class="list-group-item">3</div>
      (...)
  </div>
</div>

在第二个列表中并使用浏览器本机滚动它可以完美运行

Sortable.create(listOne, {
    animation: 150,
});


// httml
<div id="cenas" class="container">
  <div id="listOne" class="list-group content">
      <div class="list-group-item">1</div>
      <div class="list-group-item">2</div>
      <div class="list-group-item">3</div>
      (...)
  </div>
</div>

//css
#cenas {
  margin-top: 10px;
  position: relative;
  width: 480px;
  height: 206px;
  overflow-y: scroll;
}
4

0 回答 0