jquery blockui插件弹出遮罩层(页面数据)

　　1. 导入js

　　<!-- 第一种样式 -->
  　<script type="text/javascript"  src="${js_path }/jquery/jquery.blockUI.zidingyi.js?s=<%=System.currentTimeMillis() %>"></script>

 

　　2.div里面套iframe(数据页面在遮罩层上显示)

　　function ShowChart(i, data,jsdate,warnlight){
       //第二种 异步实现 处理
    $.blockUI({message : '<h6 style="text-align:right; margin:0; padding:0; padding-top:2px;"><img src="themes/introl/images/clos.gif" onclick="$.unblockUI()" style="cursor:hand"/></h6><div><iframe height="280px" width="100%" src="index.do?action=indexChart&warnlight='+warnlight+'&jsdate='+jsdate+'" frameborder="0"></iframe></div>'});
   }

 

　　3.jquery.blockUI.js
// 重写defaults对象中的属性
$.blockUI.defaults = {
 // 弹出的信息
 // div里面 套用iframe
 // 定义消息框样式
 // $.blockUI.defaults.css = {};
 // 默认定义消息框样式Css样式
 css : {
  padding : 6,
  margin : 0,
  overflow : 'hidden',
  width : '680px',
  height : '300px',
  top : '5%',
  left : '10%',
  textAlign : 'center',
  color : '#000',
  border : '1px #fff solid',
  background : '#f3f3f3 url(themes/introl/images/dttblebg.jpg) repeat-x',
  cursor : null
 },
 // 遮罩样式
 overlayCSS : {
  backgroundColor : '#000', // 颜色
  opacity : 0.6,// 透明度
  height : '1800px'
 },
 // 使用$.growlUI完成自动气泡时的样式
 growlCSS : {
  padding : 0,
  margin : 0,
  width : '50%',
  top : '80%',
  left : '35%',
  textAlign : 'center',
  color : '#000',
  border : '3px solid #aaa',
  backgroundColor : '#f0f0f0',
  cursor : null
 },
 // 是否在非IE浏览器中使IFrame获得焦点，未验证的
 forceIframe : false,
 // 遮罩层的Z-Index值，越大越在上面
 baseZ : 1000,
 // 是否居中
 centerX : true,
 centerY : true,
 // 是否允许拉大
 // 短的网页上。禁用如果你想防止车身高度的变化
 allowBodyStretch : true,
 // 遮罩时是否禁用键盘和鼠标事件
 bindEvents : true,
 // be default blockUI will supress tab navigation from leaving blocking
 // content
 // (if bindEvents is true)
 // 遮罩内容的Tab导航是否可用
 constrainTabKey : true,
 // 淡入时间
 fadeIn : 0,
 // 淡出时间
 fadeOut : 0,
 // time in millis to wait before auto-unblocking; set to 0 to disable
 // auto-unblock
 // 自动淡出时间
 timeout : 0,
 // disable if you don't want to show the overlay
 // 是否自动遮罩
 showOverlay : true,
 // if true, focus will be placed in the first available input field when
 // page blocking
 // 自动获得焦点
 focusInput : true,
 // 抑制FF/Linux的叠加样式的使用（由于具有不透明的性能问题）
 applyPlatformOpacityRules : true,
 // 调用解封已完成时回调方法;
 // onUnblock(element, options)
 onUnblock : null
};