Question

我想创建一个不应关闭的模式。幸运的是，这并不是那么困难，但是我想以这种方式制作模态，即它不应该关闭，但是作为用户，我应该能够单击文档中的元素，并在需要时填写它们（例如作为收音机，复选框等）我确实找到了与我想要的东西有关的东西，但是没有用... Bootstrap Modal - make background clickable without closing out modal因此，我认为这有点重复，但是我决定提出这个问题的原因是，因为另一个显然不起作用，而且我没有真正找到与我的问题有关的任何东西。 >

到目前为止，我有（html）：

  <!-- Button to Open the Modal -->
  <a class="far fa-question-circle" id="InstCmsInstructions" data-toggle="modal" data-target="#cmsInstructions" onclick="clearBootstrapStandardModal()"></a>

<!-- The Modal -->
<div class="modal left fade" id="cmsInstructions" tabindex="-1">
<div class="modal-dialog">
  <div class="modal-content">

    <!-- Modal Header -->
    <div class="modal-header font-family-modal">
      <h4 class="modal-title">C.M.S</h4>
      <button type="button" class="close" data-dismiss="modal">&times;</button>
    </div>

    <!-- Modal body -->
    <div class="modal-body font-family-modal">
      Modal body..
    </div>

    <!-- Modal footer -->
    <div class="modal-footer font-family-modal">
        <h6 class="mr-auto"> tt <?php echo Date('Y'); ?> &copy</h6>
      <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
    </div>

  </div>
</div>

css：

.modal.left .modal-dialog {
position: fixed;
margin: auto;
width: 320px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content {
height: 100%;
overflow-y: auto;
}

.modal.left .modal-body {
    padding: 15px 15px 80px;
}

.modal.left.fade .modal-dialog{
left: 0px;
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
transition: opacity 0.3s linear, left 0.3s ease-out;
}

.modal.left.fade.in .modal-dialog{
left: 0;
}

.modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1040;
background-color: transparent;
display: none !important;
}
.modal-backdrop.in {
filter: alpha(opacity=50);
opacity: .5;
}

引导程序模态不应关闭，但我应该能够单击其他元素（例如input字段）

0 个答案: