javascript - 完美滚动条不显示/更新模式中的滚动条

Question

我正在使用 Perfect Scrollbar ( https://github.com/noraesae/perfect-scrollbar ) 来设置滚动条的样式。问题是当我打开模式时，滚动条不会出现/更新为新样式的滚动条。它仅在我开​​始滚动内容后才出现。我发现了类似的问题:

“如果在开始滚动时出现，很可能是时序问题。请确保在div填充内容后调用PS的更新方法。我不确定正在使用哪个模态，但有可能是一个回调来处理它。”

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/ ( fiddle 没有准确地复制问题，不确定为什么当模式打开时滚动条没有出现)。这是某人对旧版本完美滚动条的摆弄，它正在做它的事情( 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});