twitter-bootstrap 如何删除引导模式覆盖?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/32459337/
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 to remove bootstrap modal overlay?
提问by Manigandaprabhu
How to remove bootstrap modal overlay for particular modal. when modal appears background has black color with some opacity is there any option for removing that elements...
如何删除特定模态的引导模态叠加。当模态出现背景具有黑色和一些不透明度时,是否有任何选项可以删除该元素...
回答by Mario Shtika
Add data-backdrop="false"option as attribute to the button which opens the modal.
将data-backdrop="false"选项作为属性添加到打开模态的按钮。
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" data-backdrop="false">
Launch demo modal
</button>
See modal options
查看模式选项
回答by Manigandaprabhu
I was able to use the following snippet to hide the model overlay by just re-hiding the modal when the shown.bs.modalevent is triggered.
我能够使用以下代码段通过在shown.bs.modal触发事件时重新隐藏模式来隐藏模型叠加层。
<script type="text/javascript">
$('#modal-id').on('shown.bs.modal', function () {
$(".modal-backdrop.in").hide();
})
</script>
回答by Duka
You can also set
你也可以设置
.modal-backdrop {
background-color: transparent;
}
in your css and bootstrap click outside function will still work.
在您的 css 和 bootstrap 中,单击外部功能仍然有效。
回答by vitthal
If you are dealing with bootstrap modal through jquery then better you use below code in your event callback function.
如果您正在通过 jquery 处理引导模式,那么最好在事件回调函数中使用以下代码。
$('.modal-backdrop').remove();
回答by Aibrean
The background is fired with the following class: .modal-backdropwith an additional .inclass for opacity.
使用以下类激发背景:.modal-backdrop具有.in用于不透明度的附加类。
Default values (edit as needed):
默认值(根据需要编辑):
.modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1040;
background-color: #000;
}
.modal-backdrop.in {
filter: alpha(opacity=50);
opacity: .5;
}
回答by TungHarry
If you using function clickin javascript (jquery). You using :
如果您click在 javascript (jquery) 中使用函数。你使用:
$("#myBtn2").click(function(){
$("#myModal2").modal({backdrop: false});
});
回答by Okechukwu Obi
You can also do it this way if you trigger you modal from javascript, add the data-backdrop="false"to the modal directly Example Below:
如果您从 javascript 触发模态,您也可以这样做,直接将data-backdrop="false" 添加到模态示例下面:
<div class="modal fade" id="notifyModal" data-backdrop="false"
tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content" id="info_content">
A Project has been deleted successfully!
</div>
</div>
</div>

