CSS弹出背景半透明窗口

王朝学院·作者佚名  2016-05-24
窄屏简体版  字體: 小  |  中  |  大  |  超大  

CSS弹出背景半透明窗口<scripttype="text/javascript"src="<ww:urlvalue='/js/jquery-1.8.3.min.js'/>"language="Javascript"></script><scripttype="text/javascript">$(function(){varquery=location.search;varequal_index=query.lastIndexOf("=");varresult_index=query.indexOf("result");varsubmit_index=query.indexOf("submit");if(result_index!=-1){if(query.substring(equal_index+1)=='success'){$("#msg").text('保存成功');pupopen();}}if(submit_index!=-1){if(query.substring(equal_index+1)=='success'){$("#msg").text('上报成功');pupopen();}}});functionpupopen(){$("#bg").css("display","block");$("#popbox").css("display","block");$(window).scroll(function(){$(window).scrollTop(0);});//禁止浏览器滚屏}functionpupclose(){$("#bg").css("display","none");$("#popbox").css("display","none");$(window).unbind("scroll");//恢复浏览器滚屏}</script><styletype="text/css">body{margin:0px;}#bg{width:100%;height:100%;top:0px;left:0px;position:absolute;filter:Alpha(opacity=50);opacity:0.5;background:#000000;display:none;}#popbox{position:absolute;width:300px;height:200px;left:50%;top:50%;margin:-200px00-200px;display:none;background:#FFFFFF;}</style><body>终于搞定这个效果了,IE和FF,OP均可以~先说原理:两个层,一个高度和宽度都是100%,另一个就是你要弹出的窗口的具体内容,半透明在IE中是用filter:Alpha(opacity=60);在非IE中用opacity:0.60;</br><divid="bg"></div><divid="popbox"><centerstyle="margin-top:70px;"><imgsrc="<ww:urlvalue='/image/correct.jpg'/>"/><spanid="msg"></span></center><br/><br/><br/><imgsrc="<ww:urlvalue='/image/ok.png'/>"width="70"height="35"onclick="pupclose()"style="cursor:pointer"/></div></body>

 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
 
© 2005- 王朝網路 版權所有 導航