滚动 - 单击无法在固定侧边栏内滚动自定义滚动条

Question

我制作了一个固定的侧边栏并应用了自定义滚动条（即 m.customscrollbar），但我希望在单击锚标记时（在手风琴内部）我想在顶部滚动手风琴侧边栏，为此我使用的代码与我在侧边栏不粘滚动正文或 html 到单击元素顶部位置时使用的代码相同。

我做错了什么？

不粘

这是侧边栏不粘的代码

$('.card > .collapse').on('shown.bs.collapse', function(e){
    e.preventDefault();  
    e.stopPropagation();
  console.log('click');

  var scrollToCategory = $(this).parent().offset().top;


  var body = $("html, body");
  body.stop().animate({scrollTop:scrollToCategory}, 500, 'swing', function() { 
     // alert("Finished animating");
  });

})

黏糊糊的

如果侧边栏是粘性的，这里是代码

$('.card > .collapse').on('shown.bs.collapse', function(e){
    e.preventDefault();  
    e.stopPropagation();
  console.log('click');

  var scrollToCategory = $(this).parent().offset().top;


  var body = $("#sidebar-wrapper");
  body.stop().animate({scrollTop:scrollToCategory}, 500, 'swing', function() { 
     // alert("Finished animating");
  });

})

这是 jsfiddle Link

Non sticky

Sticky

注意： Sticky 示例似乎在 jsfiddle 中不起作用，请将示例复制并粘贴到另一个自定义文件中:)

Answer 1

最后，

经过大量搜索，我成功了。它只是 m.custom 滚动条

中已有的一段代码

解决方法如下：

$('.card > .collapse').on('shown.bs.collapse', function(e){

   e.preventDefault();
   e.stopPropagation();

   var childPos = $(this).parent().offset();
   var parentPos = $('#sidebar').offset();
   var childOffset = {
       top: childPos.top - parentPos.top,
       left: childPos.left - parentPos.left
   }

   $("#sidebar-wrapper").mCustomScrollbar('scrollTo', '-='+childOffset.top);
});

滚动 - 单击无法在固定侧边栏内滚动自定义滚动条

Scroll - On click not able to scroll the custom scroll inside fixed sidebar

jquery

css

scroll

fixed

mcustomscrollbar