Javascript Manners

Question

Javascript Manners

Navigation

#1 by (0 votes)

0

Hi, I have a problem, and when I open a modal window with javascript, I get a black background. The problem is that I click on that black background and I can operate as if it were not. How can I make that part of the black area around the modal, can not be clicked? greetings

 .filaRondasDesc, .filaAgrDesc {
  white-space: nowrap;
  width: 20em;
  font-size: 1.1em;
  margin-bottom: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.modalOverlay, .modalOverlay_update {
  width: 100%;
  height: 100%;
  z-index: 1111;
  backgroundcolor: #000;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  margin: 0;
  padding: 0;
}

.modal {
  margin-left: auto;
  margin-right: auto;
  position: fixed;
  z-index: 1112;
  top: 47%;
  display: none;
}

javascript cordova apache modal

asked by Ruben 03.10.2017 в 09:17

source

1 answer

How to Enumerate rows in DataGridView in c # Help query MySql

score 0 · Answer 1

You have to use backdrop: 'static' to block the background.

$(function() {
  $('#uploadedImagePopup').modal({
    show: true,
    keyboard: false,
    backdrop: 'static'
  });
});

<!DOCTYPE html>
<html lang="en">

<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>

  <div class="container">

    <div class="modal fade modal-popup confirm-uploaded-image-popup" id="uploadedImagePopup" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-content modal-dialog modal-popup-content" role="document">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <div class="confirm-uploaded-image-popup-img"></div>
          <div class="modal-popup-desc">You have uploaded a picture. Are you sure you want to add it to your gallery?</div>
        </div>
        <div class="modal-footer">
          <button data-dismiss="modal" class="btn btn-very-light-gray confirm-uploaded-image-popup-cancel">Cancel</button>
          <button class="btn btn-green confirm-uploaded-image-popup-ok">OK</button>
        </div>
        <div>
        </div>
      </div>
    </div>
  </div>

</body>

</html>