jquery - how to disable html body on pop-up and close pop-up on document click -

on bootstrap html page using modal pop-up fade-in , fade-out(j-query functions) of div.

(i tried using bootstrap modal pop-over,but error shown, stating 'popover function not known'.)

pop-up contains registration form.pop-up works fine,there no close button within pop-up,so want pop-up closed when user clicks anywhere within body except pop-up area,also want disable html body when pop-up shown.

at present pop-up closed if click anywhere within html body(that includes pop-up area also!!!)

in short,what need is: (1) pop-up shouldn't closed when clicked within pop-up area (2) when pop-up shown user shouldn't access link or text-box in html-body(i have got no idea how this!!)

html:

 <div class="form-group row ">             <section class="col-lg-6 col-md-6 col-xs-6">                 <label for="firstname ">first name</label>                 <input type="text" class="form-control create-form" id="firstname">             </section>             <section class="col-lg-6 col-md-6 col-xs-6">                 <label for="lastname">last name</label>                 <input type="text" class="form-control create-form" id="lastname">             </section>         </div> 

jquery:

     $(document).ready(function () {          $(document).click(function (e) {              var t = (e.target)              if (t != $("#popup_box").get(0) &&               t != $("#popup_box").find('.create-form')) {                  unloadpopupbox();              }          });           $('.container').click(function (e) {               var t = (e.target)              if (t != $("#popup_box").get(0) && t != $("#new-account").get(0)) {                  unloadpopupbox();              }              if (t != $(".navbar-toggle").get(0)) {                  e.stoppropagation();              }          });           $('#new-account').click(function (e) {              loadpopupbox();          });           function unloadpopupbox() {                  $('#popup_box').fadeout("slow");              $('.container').css({                   "opacity": "1"              });          }           function loadpopupbox() {                 $('#popup_box').fadein("slow");              $('.container').css({                   "opacity": "0.5",                  "z-index": "999"              });          }      }); 

thanks in advance!!!

i think you.

 $("#popup_box").click(function (e) {         e.stoppropagation();         return false;             });