nicescroll，需要在 div 改变它的大小时自动调整大小

Question

我有 <article> 标签，其中包含很多文本，通常在旁边显示一个 jquery nicescroll，但如果它包含一个可以改变高度的元素（某些可折叠元素） <article> 标签和 nicescroll 不想重新加载。

我的代码：

<article class="item">
  <div class="reference">some text</div>
  <a href="#long-2" data-toggle="collapse" class="reference-long arr_down"></a>
  <div id="long-2" class="collapse">some text</div>
</div>

如果我点击a，article会变大，但我需要重新加载漂亮的卷轴，当折叠的项目再次关闭时，我需要做同样的事情。

jquery，它有时会起作用，但在 Safari 浏览器中不起作用：

$(document).ready(
function() {
$("article").niceScroll({cursorcolor:"#fff",autohidemode:false, zindex: 999});
}
);
$(function() {  
$('.reference-long').click(function(){
    $("article").getNiceScroll().remove();
    $("article").niceScroll({cursorcolor:"#fff",autohidemode:false, zindex: 999});
  });
});

Answer 1

使用resize()函数代替remove()

$("article").getNiceScroll().resize();

Answer 2

这就是解决方案

$("article").getNiceScroll().resize();

但请注意，如果您正在使用任何动画，则必须在调用 .resize() 函数之前让动画完成。

示例：

$('.reference-long').click(function(){
    $("#long-2").slideToggle(function(){
        $("article").getNiceScroll().resize();
    });
});

nicescroll，需要在 div 改变它的大小时自动调整大小

nicescroll, need to resize automatically when div changes it size

jquery

nicescroll