jquery - make background blurry and disable background -

i'm trying implement ajax loader. when loads, makes background blurred fine background contents still active. want background disabled when loader appears.

css

.container{         /* overflow: hidden; */     -webkit-filter: blur(13px);     -moz-filter: blur(13px);     -o-filter: blur(13px);     -ms-filter: blur(13px);     filter: blur(13px); } #spinner {     /* display: none; */     width:100px;     height: 100px;     position: fixed;     top: 50%;     left: 50%;     background:url(../loading.gif) no-repeat center transparent;     text-align:center;     padding:10px;     margin-left: -50px;     margin-top: -50px;     z-index:2;     overflow: auto; } 

html

<div id="spinner"></div> <div class="container">     <!-- buttons , links here, want these disabled(container gone blurred links , buttons still active)--> </div> 

any luck?

you can create div this....

.container{          /* overflow: hidden; */      -webkit-filter: blur(13px);      -moz-filter: blur(13px);      -o-filter: blur(13px);      -ms-filter: blur(13px);      filter: blur(13px);  }  #spinner  {      /* display: none;    */      width: 100px;      height: 100px;      position: fixed;      top: 50%;      left: 50%;      background: url(../loading.gif) no-repeat center transparent;      text-align: center;      padding:10px;      margin-left: -50px;      margin-top: -50px;      z-index:3;      overflow: auto;  }  #pano{      position: fixed;      top: 0;      left: 0;      width: 100%;      height:100%;      z-index: 2;  }

<div id="spinner"></div>  <div id="pano"></div> <!-- trick -->  <div class="container">      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>      <a href="#">your content goes here.... try click here</a><br/>  </div>