JQuery遮罩层
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <HTML> <HEAD> <TITLE>遮罩层效果</TITLE> <style type="text/css"> .mask { padding : 0px ; margin : 0px ; background : #555 ; position : absolute ; } </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript"> $(function(){ Mask.load() ; }) ; var Mask = function(){ function load(){ var jq = _render() ; $("body").click(function(){ unload(jq) ; }) ; } ; function unload(jq){ jq.remove() ; } ; function _render(){ var _div = $("<div></div>") .addClass("mask") .appendTo("body") ; var _css = _getCss() ; _div .css(_css) .fadeIn() ; return _div ; } ; function _getCss(){ var css = { display : "none" , top : 0 + "px" , left : 0 + "px" , width : document.documentElement.clientWidth + "px" , height : document.documentElement.clientHeight + "px" , zIndex : 9999 , opacity : 0.6 } ; return css ; } ; return { load : load , unload : unload } ; }() ; </script> </HEAD> <BODY> 测试测试 </BODY> </HTML>
相关推荐
cbao 2019-12-29
浪味仙 2019-12-24
Hhjian 2014-05-31
人心 2012-02-05
zhanghao 2016-11-24
攻城师 2019-06-28
asdjkl 2017-05-18
csscode 2016-09-13
海欣海夜 2015-06-29
最近用phonegap在安卓手机中使用Html5+css3做页面,<a name="yes" data-role="button" style="display: block;font-size:16
ruanjianxiong 2014-08-17
83540198 2014-08-01
DevilPace 2014-05-31
Kindlecode 2012-10-27
83510998 2012-04-28
89203856 2012-04-17
83453065 2012-03-14
AnyBisks 2012-02-23
yyzhu 2011-09-27