如何消除bootstrap的模态背景淡出

Question

我想向用户展示一系列模态，而不只是一个。我的目标是让第一个模态淡入背景，并将背景留给第二个和第三个模态，而不会逐渐淡出。然后在第三个模态之后，背景应该淡出。基本上我希望第一个模态与背景一起出现 - 然后第二个和第三个模态出现在同一背景上，第一个和第二个模态淡出。然后第三个模态应该随背景消失。

我尝试过以下代码，模态仍然存在，但第二个背景不会触发，因为它似乎等待前一个模态背景在触发前消失：

  $('.modal-backdrop.fade').css({
    opacity: 0.8
  });

然后我尝试从背景中删除'淡入淡出'类，但这也不起作用。

触发以下模式的代码如下：

  $modalOne.on('hidden', function (e) {
    $modalTwo.modal('show');
  }

Answer 1

我喜欢赌博。

 $('.modal-backdrop.fade').css({
     'background-color': 'rgba(0,0,0,0.8)'
 });

给它一个旋转 - 仅供参考，这是为了测试我的理论。如果有效，请使用此代替opacity。该组4个数字中的最后一位数字是 alpha级别（本质上是其不透明度）。其他的当然是红色，绿色和蓝色。

Answer 2

根据Deryck的答案，我正在玩弄它并找到适合我的解决方案。

 $('.modal-backdrop').css({
     'position': 'relative'
 });

Answer 3

在某个元素或z-index上检查相对位置我在容器元素上有z-index：0这就是导致问题的原因。 （设计师不能和他们住在一起，没有他们就离开了。）