将模态的滚动条移动到页面

Question

我目前在某些显示器上有一个比屏幕高度更长的模态。要解决此问题，请允许模态在y轴上溢出。这会在模式中创建一个滚动条，让用户可以向上和向下滚动内容。

我的问题是：如何将滚动条显示为整页滚动条而不是模式？

当前的CSS：

#scheduleModal {
  overflow-y: scroll;
  height: 80%;

}
.no-scroll {
  overflow: hidden;
}

和javascript，导致后台停止移动：

$('.modal-open-btn').on('click', function() {
  $('body').addClass('no-scroll');
});

和html的格式为：

<div aria-hidden='true' aria-labelledby='scheduleModalLabel' class='modal hide fade text-center' id='scheduleModal' role='dialog'>
  <div class='modal-header'>
    ...
  </div>
  <div class='modal-body'>
    ...
  </div>
  <div class='modal-footer'>
    ...
  </div>
</div>