JQuery可滾動排序

使用jQuery可排序，我有一個非常長的列表，強制滾動條。只要足夠長的時間就可以做到這一點，每當我抓取一個物品時，頁面就會自動開始滾動，並且LI從我的光標上跳下來。無論何時我使用較短的列表，它都可以完美工作。任何幫助？JQuery可滾動排序

當前李CSS：

min-height: 60px; 
margin-top: 12px; 
margin-bottom: 10px; 
padding: 10px 10px 15px 10px; 

background: #FAFAFA; 

.roundCorners(3px); 
.boxShadow(0,4px,10px,#222); 

border: 1px #D4D4D4 solid;

當前的jQuery：

var makeNotesSortable = function() { 
     $("#notes").sortable 
     ({ 
      update: function() { 
       console.log($("#notes")); 
       updateNoteOrder($("#notes")); 
      } 
     }).disableSelection(); 
    }

The LI to move jumps way off the cursor

來源

2012-07-06 Kerry Ritter

我無法找到一個解決這個問題，但我拒絕滾動關閉並設置軸只有'y'。

 $("#notes").sortable 
     ({ 
      scroll: false, 
      sort: function (event, ui) { 
       ui.helper.css({ 'top': ui.position.top + $(window).scrollTop() + 'px' }); 
      }, 
      helper: 'clone', 
      axis: 'y', 
      update: function() { 
       updateNoteOrder($("#notes")); 
      } 
     }).disableSelection();

來源

2012-07-09 13:38:54

調試第一次拖動！

jQuery(".sortable").sortable({ 

    axis: "y", 
    containment: "parent", 
    scroll: false, 
    handle: ".handle", 
    tolerance: "pointer", 

    create: function (event, ui) { 
     this.first_drag_debug = true; 
    }, 
    sort: function (event, ui) { 
     if (this.first_drag_debug == false) { 
     ui.item.css('top', (ui.position.top + jQuery(window).scrollTop()) + 'px'); 
     } 
    }, 
    change:function(event, ui){ 
     this.first_drag_debug = false; 
    }, 
    stop: function(event, ui){ 
     this.first_drag_debug = false; 
    }, 
    update: function(){ 
     update(); 
    }, 

});

來源

2013-04-18 13:40:38

您需要使容器自身滾動，而不是頁面主體或任何其他父級，則滾動位置將被正確計算。

來源

2013-07-19 09:33:39

@Kerry特爾的答案是解決問題的正確方法，但不要忘了通過向modifiy您對#sortable元素的CSS：

position: relative;

來源

2017-03-07 09:41:11

JQuery可滾動排序

回答

相關問題