Javascript 锁屏代码例

  <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312"   />
< title > JavaScript锁屏 </ title >
< style  type ="text/css" >
body {}{}{}{
    font-size:12px 
}
#Screen {}{}{}{
    position:absolute;
    z-index: 9998;
    top: 0px;
    left: 0px;
    background: #000000;
    display: none;
    filter: alpha(Opacity=50);
}
#Message {}{}{}{
    position: absolute;
    z-index: 9999;
    top: 180px; 
    left: 340px;
    display: none;
}
</ style >
< script  language ="javascript" >
// 获取宽度
function getWidth()
{
    var strWidth,clientWidth,bodyWidth;
    clientWidth = document.documentElement.clientWidth;
    bodyWidth = document.body.clientWidth;
    if(bodyWidth > clientWidth){
        strWidth = bodyWidth + 20;
    } else {
        strWidth = clientWidth;
    }
    return strWidth;
}
//获取高度
function getHeight()
{
    var strHeight,clientHeight,bodyHeight;
    clientHeight = document.documentElement.clientHeight;
    bodyHeight = document.body.clientHeight;
    if(bodyHeight > clientHeight){
        strHeight = bodyHeight + 30;
    } else {
        strHeight = clientHeight;
    }
    return strHeight;
}
// 锁屏
function showScreen()
{
    var Element = document.getElementById('Message');
    var Elements = document.getElementById('Screen');
    Elements.style.width = getWidth();
    Elements.style.height = getHeight();
    Element.style.display = 'block';
    Elements.style.display = 'block';
}
//解屏
function hideScreen()
{
    var Element = document.getElementById('Message');
    var Elements = document.getElementById('Screen');
    Element.style.display = 'none';
    Elements.style.display = 'none';
}
</ script >
</ head >
< body >
< div  id ="Message" >
   < table  width ="300"  border ="0"  align ="center"  cellpadding ="1"  cellspacing ="1"  bgcolor ="#CCCCCC" >
     < tr >
       < td  height ="28"  align ="right"  bgcolor ="#F2F2F2" >< span  style ="cursor:pointer;"  onclick ="javascript:hideScreen();" > 关闭 </ span >    </ td >
     </ tr >
     < tr >
       < td  height ="150"  align ="center"  bgcolor ="#F2F2F2" > 已经锁屏 ..  </ td >
     </ tr >
   </ table >
</ div >
< div  id ="Screen" ></ div >
< span  style ="cursor:pointer;"  onclick ="javascript:showScreen();" > 锁屏 </ span >
</ body >
</ html >