完美滚动条不显示/更新模态中的滚动条

Question

我使用Perfect Scrollbar（https://github.com/noraesae/perfect-scrollbar）来设置滚动条的样式。问题是当我打开我的模态时，滚动条不会出现/更新到新样式的滚动条。它只在我开始滚动内容后出现。我发现了类似的问题：

＆＃34;如果在开始滚动时出现，则很可能是计时问题。请确保PS＆＃39;在div填充内容后调用update方法。我不确定使用哪种模式，但可能会有回调来处理它。＆＃34;

https://github.com/noraesae/perfect-scrollbar/issues/263

但是，当我尝试将https://github.com/noraesae/perfect-scrollbar放入remodal脚本的代码中时，滚动条仍然无法更新，也不会出现。

编辑请在此处查看问题（http://imdarrien.com/#）按任意项目。

* Opens a modal window
* @public
*/
Remodal.prototype.open = function() {

var remodal = this;
var id;

// Check if the animation was completed
if (remodal.state === STATES.OPENING || remodal.state === STATES.CLOSING) {
  return;
}

id = remodal.$modal.attr('data-' + PLUGIN_NAME + '-id');

if (id && remodal.settings.hashTracking) {
  scrollTop = $(window).scrollTop();
  location.hash = id;
}

if (current && current !== remodal) {
  halt(current);
}

current = remodal;

lockScreen();
remodal.$bg.addClass(remodal.settings.modifier);
remodal.$overlay.addClass(remodal.settings.modifier).show();
remodal.$wrapper.show().scrollTop(0);
remodal.$modal.focus();

syncWithAnimation(
  function() {
    setState(remodal, STATES.OPENING);
  },

  function() {
    setState(remodal, STATES.OPENED);
  },

  remodal);
};

https://jsfiddle.net/01n947d0/（小提琴并没有完全复制问题，不确定为什么当模态打开时滚动条没有出现）。这里有人用旧版本的完美滚动条做其事（http://codepen.io/Labirintami/pen/OPRWWY）

编辑这是初始化prefectScrollbar的代码

$(document).ready(function ($) {   
    $('.remodal').perfectScrollbar({suppressScrollX: true, maxScrollbarLength: 200});   
  });

$(".remodal").perfectScrollbar('update');

Answer 1

正如我们在评论中所说，您必须在内容显示后初始化滚动条。

 remodal.$wrapper.show().scrollTop(0);
 $('.remodal').perfectScrollbar({suppressScrollX: true, maxScrollbarLength: 200});