[英]how to enable backdrop shadow of the modal?
我创建了一个用于注册和登录的引导程序模态。我发现,当模态弹出时,背景不会像我使用引导程序模态时那样会自动被遮挡,但我无法找到原因。 我希望打开模态时背景会变暗,以便用户只能专注于模态内容。我也希望模态位于屏幕中心。 所以,谁能告诉我该怎么做?
以下是我的模态代码?
<!-- Modal -->
<div class="modal reg_modal " id="regestration" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
<div class="modal-dialog" id="reg_outer_div" data-backdrop="true" >
<div class="modal-content " style="background: white;width:700px;">
<div class="modal-header" id ="reg_modal_header" style="">
<button type="button" class="close reg" id ="reg_close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" align="center" style="color:white;" id="reg_log_modal_header_text"> </h4>
</div><!--/header-->
<div class="modal-body" style="background: white;" id="regmodal_body">
</div><!-- /end modal body-->
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
您的代码似乎可以正常工作。
<a data-toggle="modal" href="#regestration" class="btn btn-primary btn-large">Launch demo modal</a>
<div class="modal reg_modal " id="regestration" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
<div class="modal-dialog" id="reg_outer_div" data-backdrop="true" >
<div class="modal-content " style="background: white;width:700px;">
<div class="modal-header" id ="reg_modal_header" style="">
<button type="button" class="close reg" id ="reg_close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" align="center" style="color:white;" id="reg_log_modal_header_text"> </h4>
</div><!--/header-->
<div class="modal-body" style="background: white;" id="regmodal_body">
</div><!-- /end modal body-->
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
检出小提琴http://jsfiddle.net/x79kS/
检查您是否没有包括jquery对话框。
有关文档,请参见http://getbootstrap.com/2.3.2/javascript.html#modals
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.