模拟弹出窗口效果，关闭层之前，不能选择后面的页内容

更新时间：2007年02月07日 00:00:00 作者：

<script type="text/javascript" language="javascript"> //more javascript from http://www.smallrain.net         function sAlert(str){         var msgw,msgh,bordercolor;         msgw=400;//提示窗口的宽度         msgh=100;//提示窗口的高度         titleheight=25 //提示窗口标题高度         bordercolor="#c51100";//提示窗口的边框颜色         titlecolor="#c51100";//提示窗口的标题颜色                  var sWidth,sHeight;         sWidth=screen.width;         sHeight=screen.height;         var bgObj=document.createElement("div");         bgObj.setAttribute('id','bgDiv');         bgObj.style.position="absolute";         bgObj.style.top="0";         bgObj.style.background="#cccccc";         bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";         bgObj.style.opacity="0.6";         bgObj.style.left="0";         bgObj.style.width=sWidth + "px";         bgObj.style.height=sHeight + "px";         bgObj.style.zIndex = "10000";         document.body.appendChild(bgObj);                  var msgObj=document.createElement("div")         msgObj.setAttribute("id","msgDiv");         msgObj.setAttribute("align","center");         msgObj.style.background="white";         msgObj.style.border="1px solid " + bordercolor;         msgObj.style.position = "absolute";         msgObj.style.left = "50%";         msgObj.style.top = "50%";         msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif";         msgObj.style.marginLeft = "-225px" ;         msgObj.style.marginTop = -75+document.documentElement.scrollTop+"px";         msgObj.style.width = msgw + "px";         msgObj.style.height =msgh + "px";         msgObj.style.textAlign = "center";         msgObj.style.lineHeight ="25px";         msgObj.style.zIndex = "10001";        var title=document.createElement("h4");        title.setAttribute("id","msgTitle");        title.setAttribute("align","right");        title.style.margin="0";        title.style.padding="3px";        title.style.background=bordercolor;        title.style.filter="progid:DXImageTransform.Microsoft.Alpha(startX=20, startY=20, finishX=100, finishY=100,style=1,opacity=75,finishOpacity=100);";        title.style.opacity="0.75";        title.style.border="1px solid " + bordercolor;        title.style.height="18px";        title.style.font="12px Verdana, Geneva, Arial, Helvetica, sans-serif";        title.style.color="white";        title.style.cursor="pointer";        title.innerHTML="关闭";        title.onclick=function(){             document.body.removeChild(bgObj);             document.getElementById("msgDiv").removeChild(title);             document.body.removeChild(msgObj);             }        document.body.appendChild(msgObj);        document.getElementById("msgDiv").appendChild(title);        var txt=document.createElement("p");        txt.style.margin="1em 0"        txt.setAttribute("id","msgTxt");        txt.innerHTML=str;        document.getElementById("msgDiv").appendChild(txt);         }     </script><input type="button" value="点击这里" onclick="sAlert('test弹窗效果');" />

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

相关文章

JavaScript中的16进制字符介绍
最早接触到\unnn之类的字符是在微软的官网上。当时在网上找了一下这中字符格式，却不知道该搜什么
2011-10-10
JS 参数传递的实际应用代码分析
在项目中，有一个Ajax加载的区域，是一个Div标签，id为msg_box，这个控制链接包含在一个左侧的导航中，当从其他页面链接到这个页面时，该JS代码就失效了。
2009-09-09
利用JavaScript实现网页版2048小游戏
这篇文章主要介绍了如何利用HTML+CSS+JS编写一个网页版的2048小游戏,代码简单易懂对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2022-11-11
javascript实现获取指定精度的上传文件的大小简单实例
下面小编就为大家带来一篇javascript实现获取指定精度的上传文件的大小简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-10-10
JavaScript实现HTML导航栏下拉菜单
这篇文章主要为大家详细介绍了JavaScript实现HTML导航栏下拉菜单，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-11-11
js实现jquery的offset()方法实例
这篇文章主要介绍了js实现jquery的offset()方法,实例分析了jquery的offset()方法原理与采用javascript实现的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
2015-01-01
全面解析Bootstrap图片轮播效果
这篇文章主要介绍了全面解析Bootstrap图片轮播效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2015-12-12
js 去掉空格实例 Trim() LTrim() RTrim()
js 去掉空格实例Trim(),LTrim(),RTrim() 需要的朋友可以过来参考下，希望对大家有所帮助
2014-01-01
JS实现部分HTML固定页面顶部随屏滚动效果
这篇文章主要介绍了JS实现部分HTML固定页面顶部随屏滚动效果,涉及JavaScript响应onscroll事件动态操作页面元素属性的相关技巧,需要的朋友可以参考下
2015-12-12
JavaScript随机生成颜色的方法
这篇文章主要介绍了JavaScript随机生成颜色的方法的相关资料,非常不错，代码简单易懂，具有参考借鉴价值，需要的朋友可以参考下
2016-10-10

最新评论