【问题标题】:Scroll - On click not able to scroll the custom scroll inside fixed sidebar滚动 - 单击时无法滚动固定侧边栏中的自定义滚动
【发布时间】:2019-01-17 16:02:29
【问题描述】:

我制作了一个固定的侧边栏并应用了自定义滚动条 (iemcustomscrollbar) 但我希望在单击锚标记时(手风琴内部)我想滚动侧边栏顶部的手风琴,为此我如果侧边栏不粘以将正文或 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 链接

Non sticky

Sticky

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

【问题讨论】:

    标签: jquery css scroll fixed mcustomscrollbar


    【解决方案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);
    });
    

    【讨论】:

      猜你喜欢
      • 2015-09-23
      • 2021-07-20
      • 1970-01-01
      • 2013-01-21
      • 1970-01-01
      • 2014-01-25
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多