twitter-bootstrap 如何消除引导程序的模态背景的淡出
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20820764/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I remove the fade out of bootstrap's modal-backdrop
提问by YPCrumble
I want to show the user a series of modals, not just one. My goal is to have the first modal fade in with a backdrop, and leave the backdrop up for the second and third modals without it fading out. The backdrop should then fade out after the third modal. Essentially I want the first modal to appear with the backdrop - then the second and third modals appear over the same backdrop as the first and second modals fade out. Then the third modal should disappear with the backdrop.
我想向用户展示一系列模态，而不仅仅是一个。我的目标是让第一个模态在背景中淡入，并为第二个和第三个模态保留背景而不会淡出。然后背景应该在第三个模式之后淡出。本质上，我希望第一个模态与背景一起出现 - 然后第二个和第三个模态出现在与第一个和第二个模态淡出相同的背景上。然后第三个模式应该与背景一起消失。
I've tried the following code, the modal remains, but the second backdrop won't fire as it seems it waits for the previous modal-backdrop to disappear before firing:
我已经尝试了以下代码，模态仍然存在，但第二个背景不会触发，因为它似乎等待前一个模态背景在触发之前消失：
$('.modal-backdrop.fade').css({
opacity: 0.8
});
I then tried removing the 'fade' class from the backdrop but that doesn't work either.
然后我尝试从背景中删除“淡入淡出”类，但这也不起作用。
The code that triggers the following modal is as follows:
触发如下模态的代码如下：
$modalOne.on('hidden', function (e) {
$modalTwo.modal('show');
}
回答by Deryck
I like to gamble.
我喜欢赌博。
$('.modal-backdrop.fade').css({
'background-color': 'rgba(0,0,0,0.8)'
});
Give that a whirl - FYI this is to test a theory of mine. If it works, use this instead of opacity. The last digit in that set of 4 numbers is the alpha level(essentially its opacity). The others are red, greenand blueof course.
试一试 - 仅供参考，这是为了测试我的理论。如果有效，请使用 this 而不是opacity。这 4 个数字的最后一个数字是alpha 级别（本质上是它的不透明度）。其他的当然是红色、绿色和蓝色。
回答by Jules Lee
Well based on the answer from Deryck, I was toying around it and came to this solution that worked for me.
好吧，根据 Deryck 的回答，我在玩弄它并找到了对我有用的解决方案。
$('.modal-backdrop').css({
'position': 'relative'
});
回答by Vladimir Bozic
Check position relative on some element or z-index i had z-index: 0 on container element and this what cause the issue. (Designers can't live with them, can't leave without them :))
检查某个元素或 z-index 上的相对位置我在容器元素上有 z-index: 0 这就是导致问题的原因。（设计师不能和他们一起生活，不能没有他们:)）
