ASP.NET与Javascript实现半透明背景及模式弹出个性化页面实例
作者 佚名技术
来源 NET编程
浏览
发布时间 2012-04-12
|
开发Web应用时，经常会有弹出模式对话框的情况，可以直接调用window.showModalDialog()方法，一般情况就可以了。 但有一些应用场景，需要我们弹出一些自定义控件或页面，同时用一层半透明的背景将页面的其他地方遮住，以防止用户的其他操作，以达到一种“模式窗口”的效果，这里给出一个实现此类效果，同时支持弹出自定义控件页面中通过委托更新主页面的操作功能，当然，此应用支持IE和FireFox两种浏览器。  详细代码脚本及页面代码如下： <!--[endif]--> a) CSS样式：Base.css文件 1 div.Container { width:700px; min-height:300px; border:solid 1px #003366; background-image:url(/images/PopupBG.gif); background-repeat:repeat-x; background-color:#d9e1e8; }2 div.Content { width:640px; min-height:280px; margin-left:30px; margin-top:20px; } 3 div.ShieldBG { background-color:Gray; filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5;} 4 div.ItemRow { display:inline; } b) Javascript脚本：PositionCaculate.js文件 1 //2 // Object for parameters. 3 var MemberParameters = { 4 // Id of container div. 5 ContainerDivId: "div_Container", 6 // Id of ShieldBG. 7 ShieldBGId : "div_ShieldBG", 8 // Class Name of ShieldBG. 9 ShieldBGClassName: "ShieldBG", 10 // Number of z-index of ShieldBG. 11 ShieldBGZIndex: 100, 12 // Whether scroll tag. 13 IsScroll: false, 14 // Default space for pop-up layout to left and top. 15& |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
你可能对下面的文章感兴趣
关于ASP.NET与Javascript实现半透明背景及模式弹出个性化页面实例的所有评论
