JQuery弹出炫丽对话框的同时让背景变灰色

  这段时间在做开发时,用到了JQuery弹出炫丽对话框,背景变灰色。特地和大家分享分享。

  先看效果图:

JQuery弹出炫丽对话框的同时让背景变灰色

  代码如下:

  

复制代码 代码如下:

  <html xmlns="http://www.w3.org/1999/xhtml">

  <head>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <script src="js/jquery-1.9.1.js"></script>

  <script src="js/jquery-ui.js"></script>

  <link rel="stylesheet" type="text/css" href="css/jquery-ui.css">

  <title>JQuery弹出框,背景变灰色</title>

  <script type="text/javascript">

  $(document).ready(function(e) {

  $( "#reviews" ).bind('click',function(event) {

  $( "#checkandPass" ).dialog({

  autoOpen: true,

  width: 765 ,

  show: "blind",

  hide: "explode",

  modal: true,//设置背景灰的

  });

  $( "#checkandPass" ).dialog( "open" );

  return true;

  });

  });

  </script>

  </head>

  <body>

  <div>

  <input type="button"id="reviews"value="Click me"/>

  </div>

  <div id="checkandPass" title="审核意见" style="display: none;">

  <form id="passideas_true" method="post" enctype="multipart/form-data" >

  <div>

  <textarea style="width:100%;height:90%;min-height: 100px;"></textarea>

  </div>

  <div style="margin-top: 20px;text-align: center;">

  <button style="height:30px;width:80px;" type="button" id="upfpass_true" >确定</button>

  <button style="height:30px;width:80px;" id="sb">取消</button>

  </div>

  </form>

  </div>

  </body>

  </html>

  保证是你要的效果。