点击一个事件，弹出一个全屏的DIV(全屏的意义就是把浏览器全部遮住)-ASP.NET教程-爱易网页

点击一个事件，弹出一个全屏的DIV(全屏的意义就是把浏览器全部遮住)

日期：2014-05-17　浏览次数：20476 次

点击一个事件，弹出一个全屏的DIV(全屏的意思就是把浏览器全部遮住)
求救：
点击一个事件，弹出一个全屏的DIV(全屏的意思就是把浏览器全部遮住（类似于一个winform的全屏）)???
这个要怎么样来处理？？？

------解决方案--------------------
ColorBox应该可以。

http://www.jacklmoore.com/colorbox

width和Height的值用浏览器客户窗口大小即可。
------解决方案--------------------

HTML code


<head>
    <title></title>

    <script type="text/javascript">

        function sAlert(str) {
            var msgw, msgh, bordercolor;
            msgw = 300;//提示窗口的宽度
            msgh = 200;//提示窗口的高度
            titleheight = 25; //提示窗口标题高度
            bordercolor = "#FF3C00";//提示窗口的边框颜色
            titlecolor = "#D2CECE";//提示窗口的标题颜色

            var sWidth, sHeight;
            //sWidth=document.body.offsetWidth;//得出当前屏幕的宽
            sWidth = document.body.clientWidth;//BODY对象宽度

            //sHeight=screen.height; //得到当前屏幕的高
            //sHeight=document.body.clientHeight;//BODY对象高度
            if (window.innerHeight && window.scrollMaxY) {
                sHeight = window.innerHeight + window.scrollMaxY;
            }
            else if (document.body.scrollHeight > document.body.offsetHeight) {
                sHeight = document.body.scrollHeight;
            }
            else {
                sHeight = document.body.offsetHeight;
            } //以上得到整个屏幕的高
            //这个主要是不能取到合适的高
            //sHeight = document.body.offsetWidth;
            var bgObj = document.createElement("div");//创建一个div对象
            bgObj.setAttribute('id', 'bgDiv');//可以用bgObj.id="bgDiv"的方法，是为div指定属性值
            bgObj.style.position = "absolute";//把bgObj这个div绝对定位
            bgObj.style.top = "0";//顶部为0
            bgObj.style.background = "#777";//背景颜色
            bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3,opacity=25,finishOpacity=75)";//IE浏览器透明度设置
            bgObj.style.opacity = "0.6";//透明度（火狐浏览器中）
            bgObj.style.left = "0";//左边为0
            bgObj.style.width = sWidth+"PX";//宽（上面得到的屏幕宽度）
            bgObj.style.height = sHeight+"PX";//高（上面得到的屏幕高度）
            bgObj.style.zIndex = "100"; //层的Z轴位置
            document.body.appendChild(bgObj);

            var msgObj = document.createElement("div");//创建一个div对象
            msgObj.setAttribute("id", "msgDiv");//可以用bgObj.id="msgDiv"的方法，是为div指定属性值
            msgObj.setAttribute("align", "center");//为div的align赋值
            msgObj.style.background = "white"; //背景颜色为白色
            msgObj.style.border = "1px solid #FF3C00 ";//边框属性，颜色在上面已经赋值
            msgObj.style.position = "absolute";//绝对定位
            msgObj.style.left = "35%";//从左侧开始位置
            msgObj.style.top = "30%";//从上部开始位置
            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 = msgw + "px";//提示框的高（上面定义过）
            msgObj.style.textAlign = "center";//文本位置属性，居中
            msgObj.style.lineHeight = "25PX";//行间距
            msgObj.style.zIndex = "101";//层的Z轴位置

            var title = document.createElement("h4");//创建一个h4对象
            title.setAttribute("id", "msgTitle");//为h4对象添加标题
            title.setAttribute("align", "right");//文字对齐方式
            title.style.margin = "0";//浮动
            title.style.padding = "3PX";//浮动
            title.style.background = titlecolor;//背景颜色

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

点击一个事件，弹出一个全屏的DIV(全屏的意义就是把浏览器全部遮住)

相关资料更多>

推荐阅读更多>