使用jquery ui draggable,是否可以在垂直与水平方向上具有不同的滚动敏感度？

Question

我正在使用jquery ui draggable,我意识到当我向下拖动时(相对于左/右),我希望滚动灵敏度更小.是否可以为垂直拖动和水平拖动设置不同的设置？

这是我目前的代码

   $(".myDraggable").draggable(
            {
                stack: ".myDraggable",
                scroll: true,
                scrollSensitivity: 250,
                scrollSpeed: 40,
                revert: function (event, ui) {
                    $(this).data("uiDraggable").originalPosition = {
                        top: 0,
                        left: 0
                    };
                    return !event;
                }
            }
        );

Answer 1

更新答案

工作示例： http: //jsfiddle.net/22bpbsrw/3/

我认为检测视口中何时发生滚动事件确实有效。然后您可以设置滚动速度和灵敏度。

var lastScrollTop = 0,
    lastScrollLeft = 0,
    delta = 5;
$('#viewPort').scroll(function (event) {
    var st = $(this).scrollTop();
    var sl = $(this).scrollLeft();

    if (Math.abs(lastScrollTop - st) > delta) {
        $("#draggable").draggable("option", "scrollSensitivity", 5);
        $("#draggable").draggable("option", "scrollSpeed", 10);
        (st > lastScrollTop) ? console.log('scroll down') : console.log('scroll up');
        lastScrollTop = st;
    }

    if (Math.abs(lastScrollLeft - sl) > delta) {
        $("#draggable").draggable("option", "scrollSensitivity", 100);
        $("#draggable").draggable("option", "scrollSpeed", 40);
        sl > lastScrollLeft ? console.log('scroll right') : console.log('scroll left');
        lastScrollLeft = sl;
    }
});

旧答案

离开只是为了帮助别人。

您不能明确scrollSensitivity为每个方向设置不同的值。也许您可以提交该增强功能的票证？

您也许可以通过拖动功能更改它（基于此答案）。请参阅此处的工作示例：http://codepen.io/anon/pen/mbups? editors=001

drag: function(e) {    
  console.log($("#drag1").draggable( "option", "scrollSensitivity"));
  if(prevX == -1) { prevX = e.pageX; }
  // dragged left or right
  if(prevX > e.pageX || prevX < e.pageX) { // dragged right
      $("#drag1").draggable( "option", "scrollSensitivity", 100 );
  }
  prevX = e.pageX;
 
 if(prevY == -1) { prevY = e.pageY; } 
  // dragged up or down
  if(prevY > e.pageY || prevY < e.pageX) { // dragged down
      $("#drag1").draggable( "option", "scrollSensitivity", 1 );
  }
  prevY = e.pageY;
}

scrollSensitivity您可以根据拖动元素的方向来设置。