javascript控制层显示或隐藏的方法
2015-07-22 17:22
726 查看
本文实例讲述了javascript控制层显示或隐藏的方法。分享给大家供大家参考。具体实现方法如下:
<html> <head> <title>中国风</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <script language="JavaScript"> function showLay1(){ lay1.style.visibility="visible"; lay2.style.visibility="hidden"; lay3.style.visibility="hidden"; } function showLay2(){ lay1.style.visibility="visible"; lay2.style.visibility="visible"; lay3.style.visibility="hidden"; } function showLay3(){ lay1.style.visibility="visible"; lay2.style.visibility="visible"; lay3.style.visibility="visible"; } </script> <body> <div id="lay1" style="position:absolute; left:60px; top:30px; width:250px; height:200px; index:1; visibility:visible">这是第一层内容,它的背景是透明的</div> <div id="lay2" style="position:absolute; left:60px; top:30px; width:250px; height:200px; index:2; visibility:hidden; background-color:silver">这是第二层内容,它的背景是灰色的</div> <div id="lay3" style="position:absolute; left:60px; top:30px; width:250px; height:200px; index:3; visibility:hidden"><br><br><br>这是第三层内容,它的背景是透明的</div> <form id="form1" style="position:absolute; left:70px; top:250px;"> <input type="button" value="第一层" onclick="showLay1()"> <input type="button" value="第二层" onclick="showLay2()"> <input type="button" value="第三层" onclick="showLay3()"> </form> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。
您可能感兴趣的文章:
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 异步流程控制:7 行代码学会 co 模块
- JavaScript拆分字符串时产生空字符的原因
- IE8开发人员工具教程(二)
- IE:如何做到全屏显示
- 修改注册表实现在桌面上显示Windows版本
- 在flex中执行一个javascript方法的简单方式
- Flex结合JavaScript读取本地路径的方法
- 如何隐藏程序的运行
- PowerShell设置文件只读、隐藏属性的方法
- PowerShell中执行Javascript的方法示例
- javascript asp教程第六课-- response方法
- javascript asp教程More About Recordsets