title: How To make background blur when html popup modal opens?
body: <p>When I click on a button a popup opens so I want when the popup modal opens, background page gets blurred.</p>
  
  <pre><code>&lt;div class="modal" id="myModal"&gt;
  &lt;div class="modal-dialog modal-lg"&gt;
      &lt;div class="modal-content"&gt;
          &lt;div class="modal-body" style="max-height:500px;"&gt;
              &lt;div class="panel-title text-center" style="width: 99%; padding: 1%;"&gt;
                  &lt;h1 class="title"&gt;Titels&lt;/h1&gt;
                  &lt;hr style="border: 2px solid;"/&gt;
              &lt;/div&gt;
  
              &lt;div class="table100 ver1 m-b-110"&gt;
                  &lt;div class="table100-body js-pscroll"&gt;
                      &lt;table id="Table" class="display" style="width:100%"&gt;
                          &lt;thead&gt;
                          &lt;tr class="row100 head"&gt;
                              &lt;th style="text-align: center" class="cell100 column1"&gt;id&lt;/th&gt;
                              &lt;th style="text-align: center" class="cell100 column1"&gt;name&lt;/th&gt;
                              &lt;th style="text-align: center" class="cell100 column1"&gt;sname&lt;/th&gt;
                              &lt;th style="text-align: center" class="cell100 column1"&gt;dname&lt;/th&gt;
                          &lt;/tr&gt;
                          &lt;/thead&gt;
                      &lt;/table&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
  
          &lt;div class="modal-footer"&gt;
              &lt;button type="button" class="btn btn-danger" id="close" data-dismiss="modal"&gt;Close&lt;/button&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>This is my popup modal code but I don't know how to to make the background blur when this opens.</p>