javascript - jscrollpane 阻止滚动父级

Question

我可以制作 jscrollpne，即使子滚动已到达底部，父窗格也不会滚动。现在，当子滚动到达父级的底部滚动时。我希望父级仅在鼠标超出子级滚动窗格时滚动。

Answer 1

您描述的行为是设计使然。这就是本机浏览器滚动条在具有溢出的元素上的行为方式：auto。我不建议更改它。但是，如果您希望 Borgenk 的答案是正确的，您可以使用以下代码：

$('.scroll-pane')
    .jScrollPane()
    .bind(
        'mousewheel',
        function(e)
        {
            e.preventDefault();
        }
    );

请参阅此处的示例（您可能需要缩小窗口，以便父级需要滚动）：http: //jsfiddle.net/VYcDZ/51/

Answer 2

你可以使用event.preventDefault()

$('.selector').mousewheel(function(event) {
    event.preventDefault();
});

Answer 3

今晚遇到这个问题...看到没有人有答案所以我写了它

var blockScrollTarget;    
$('.jscroll').mousewheel(blockScroll);
        ......
    function blockScroll(e) {
        blockScrollTarget = blockScrollTarget || $(e.currentTarget);
        var d = blockScrollTarget.data('jsp');
        if(d.getPercentScrolledY() == 1 || d.getPercentScrolledY() == 0) {
          return true;
        }
        if(d.getIsScrollableV()) {
          e.preventDefault();
        }
      }

Answer 4

上面的答案对我不起作用。如果您对编辑插件源代码感到满意，您可以将相关的内部方法公开给公共 api：

// Public API
$.extend(
  jsp,
    {

      ...

      initMousewheel : function(){
        initMousewheel();
      },
      removeMousewheel : function(){
        removeMousewheel();
      }

    }
  );

现在您可以有条件且实用地启用/禁用任何 jscrollpane 的滚动：

api = $('#full-page-container').data('jsp');
api.removeMousewheel(); // disable
api.initMousewheel(); // enable