WP Media Uploader模式与引导模式冲突

时间:2016-02-21 作者:luke

我在引导模式中创建了一个表单,允许用户从前端创建新帖子。在我想将文件上载到媒体库或选择已上载的文件之前,一切似乎都正常:

这将使用WordPress核心中的JS打开另一个模式。不幸的是,BS和WP模态都在body标签上使用相同的类来表示打开的模态:modal-open. 关闭第二个打开(WP)模式时,该类将从车身上移除,从而导致不必要的行为。您可以在后台滚动文档,但不能滚动模式本身。

如何解决这一冲突?

1 个回复
最合适的回答,由SO网友:luke 整理而成

只需代理modal-open 类用于如下引导:

.bs-modal-open {
  overflow: hidden;
}

.bs-modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

// or using sass …

.bs-modal-open {
  @extend .modal-open;
}
添加/删除bs-modal-open 打开/关闭BS模式时,对车身进行分类:

$(\'.bs-modal\')
  .on(\'show.bs.modal\', function (e) {
    $(\'body\').addClass(\'bs-modal-open\');
  })
  .on(\'hidden.bs.modal\', function (e) {
    $(\'body\').removeClass(\'bs-modal-open\');
  });
最后添加bs-modal 向您的每个BS模态分类:

<div class="modal bs-modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  …
</div>