JavaScript仿关机界面_层和布局特效

查看演示效果

JavaScript仿关机界面,其实是一个隐藏层、显示层的应用,用了一个布满小点的图片当作背景,你完全可以将图片更换为某一背景颜色,这样就完全是一个隐藏层的效果了。<html> <head> <title>JavaScript隐藏层、显示层仿关机界面</title> <script language="JavaScript"> <!-- function ShowLayer(foreID) { var backgroundIDWidth = document.body.clientWidth; var backgroundIDHeight = document.body.clientHeight; backgroundID.style.width = backgroundIDWidth; backgroundID.style.height = backgroundIDHeight; backgroundID.style.display = "block"; var foreTop = (backgroundIDHeight/2)-(parseInt(foreID.style.height)/2); var foreLeft = (backgroundIDWidth/2)-(parseInt(foreID.style.width)/2); foreID.style.top = foreTop; foreID.style.left = foreLeft; foreID.style.display = "block"; } function HiddenLayer(foreID) { backgroundID.style.display = "none"; foreID.style.display = "none"; } //--> </script> </head> <body> <input type="text" name=""> <input type="text" name=""> <input type="text" name=""> <div id="backgroundID" style="display:none;1122123<img src='http://p1.mb5u.com/texiao/3/20100522231348322.gif' _fcksavedurl='http://p1.mb5u.com/texiao/3/20100522231348322.gif'>2244234background:url('http://p1.mb5u.com/texiao/3/20100522231348322.gif');position:absolute;top:0px;left:0px;"></div> <div id="foreID" style="display:none;background-color:#FFFFE1;position:absolute;top:0px;left:0px;width:500px;height:400px;"><input type="button" value="隐藏层" onclick="javascript:HiddenLayer(foreID);"></div> <input type="button" value="显示层" onclick="javascript:ShowLayer(foreID);"> </body> </html>

所属频道:层和布局特效/更新时间:2012-11-01
相关层和布局特效

层和布局特效Rss订阅特效代码搜索