样式代码： 复制代码 代码如下: #div_maskContainer { display: none; } /*蒙版样式*/ #div_Mask{ z-index:1000; filter:alpha(opacity=40); position: absolute; left:0px; top:0px; background-color: #D4D0C8; } /*显示信息样式*/ #div_loading{ width:300px;height: 60px;position: absolute; border: 1px outset #B4E0F2; padding-top: 40px; text-align: center; background-color: #CCE9F9; z-index: 10000; filter:alpha(opacity=100);!important } js控件代码： 复制代码 代码如下: /** 蒙版信息控件 用法： 1.引用 mask.css 2.引用 mask.js 3.调用方法 var obj=new MaskControl(); //显示蒙版提示信息 obj.show("显示的提示信息"); //隐藏蒙版提示信息 obj.hide(); //显示提示信息，并隔timeOut(1000代表1秒)自动关闭 obj.autoDelayHide=function(html,timeOut) */ function MaskControl(){ this.show=function(html){ var loader=$("#div_maskContainer"); if(loader.length==0){ loader=$("<div id='div_maskContainer'><div id='div_Mask' ></div><div id='div_loading' ></div></div>"); $("body").append(loader); } self.loader=loader; var w=$(window).width(); var h=$(window).height(); var divMask=$("#div_Mask"); divMask.css("top",0).css("left",0).css("width",w).css("height",h); var tipDiv=$("#div_loading"); if(html==undefined) html=""; tipDiv.html(html); loader.show(); var x=(w-tipDiv.width())/2; var y=(h-tipDiv.height())/2; tipDiv.css("left",x); tipDiv.css("top",y); }, this.hide=function(){ var loader=$("#div_maskContainer"); if(loader.length==0) return ; loader.remove(); }, this.autoDelayHide=function(html,timeOut){ var loader=$("#div_maskContainer"); if(loader.length==0) { this.show(html); } else{ var tipDiv=$("#div_loading"); tipDiv.html(html); } if(timeOut==undefined) timeOut=3000; window.setTimeout(this.hide,timeOut); } }

　　推荐阅读

　　菜鸟javascript基础整理1

1复制代码 代码如下://页面中写入html内容 document.write("<h1>Hello World!</h1>")2复制代码 代码如下://为了防止不支持 JavaScript 的浏览器把js当作为页面的内容来显示 //注释行末尾的两个正斜杠是 JavaScript>>>详细阅读

本文标题：jquery蒙版控件实现代码

地址：http://www.17bianji.com/kaifa2/JS/25245.html

 1/2    1