码迷,mamicode.com
首页 > Web开发 > 详细

js实现弹出窗口、页面变成灰色并不可操作的例子

时间:2015-07-16 15:48:41      阅读:127      评论:0      收藏:0      [点我收藏+]

标签:

function show() //显示隐藏层和弹出层

    {

        var hideobj=document.getElementById("hidebg");

        hidebg.style.display="block"; //显示隐藏层

        hidebg.style.height=document.body.clientHeight+"px"; //设置隐藏层的高度为当前页面高度

        document.getElementById("hidebox").style.display="block"; //显示弹出层

    }

    function hide() //去除隐藏层和弹出层

    {

        document.getElementById("hidebg").style.display="none";

        document.getElementById("hidebox").style.display="none";

    }
 #hidebg { position:absolute;left:0px;top:0px;

    background-color:#000;

    width:100%; /*宽度设置为100%,这样才能使隐藏背景层覆盖原页面*/

    filter:alpha(opacity=60); /*设置透明度为60%*/

    opacity:0.6; /*非IE浏览器下设置透明度为60%*/

    display:none; /* http://www.jb51.net */

    z-Index:2;}

    #hidebox { position:absolute;width:400px;height:300px;top:200px;left:30%;background-color:#fff;display:none;cursor:pointer;z-Index:3;}

hidebg:隐藏背景层div的id

hidebox:消息框div的id

js实现弹出窗口、页面变成灰色并不可操作的例子

标签:

原文地址:http://www.cnblogs.com/Tinoloving/p/hintBox.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!