点击隐藏页面左栏或右栏实现js代码


Posted in Javascript onApril 01, 2013

点击隐藏页面左栏或右栏(同一TABLE中)

<style type="text/css"> 
<!-- 
.navPoint {COLOR: white; CURSOR: hand; FONT-FAMILY: Webdings; FONT-SIZE: 9pt} 
.STYLE1 {FONT-FAMILY: Webdings; FONT-SIZE: 9pt; cursor: hand;} 
--> 
</style> 
<script> 
function switchSysBar(){ 
if (switchPoint.innerText==3){ 
switchPoint.innerText=4 
document.all("frmTitle").style.display="none" 
}else{ 
switchPoint.innerText=3 
document.all("frmTitle").style.display="" 
}} 
</script> 
<table border="0" cellPadding="0" cellSpacing="0" height="100%" width="100%"> 
<tr> 
<td width="20%" align="middle" vAlign="center" noWrap bgcolor="#CC99FF" id="frmTitle" name="frmTitle"> </td> 
<td class=a2 style="WIDTH: 9pt"><table border="0" cellPadding="0" cellSpacing="0" height="100%"> 
<tr> 
<td style="HEIGHT: 100%" onClick="switchSysBar()"><font style="FONT-SIZE: 9pt; CURSOR: default; COLOR: #ffffff"> <br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<font color="#FF0000"><br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<span class="STYLE1" id="switchPoint" title="关闭/打开左栏">3</span><br/> 
<br/> 
<br/> 
<br/> 
<br/> 
<br/> 
</font><br/> 
<br/> 
屏幕切换 </font></td> 
</tr> 
</table></td> 
<td bgcolor="#FFCC99" style="WIDTH: 100%"> </td> 
</tr> 
</table> 
想把隐藏左右栏的那个按钮按成图片,改一下JS,IMG增加ID,这里id=aa,也可以换成其它的名称,参考如下: 
<script> 
function switchSysBar(){ 
if (document.all.aa.src.indexOf("bl_1")!=-1){ 
aa.src="images/al_1.gif" 
document.all("frmTitle").style.display="none" 
}else{ 
aa.src="images/bl_1.gif" 
document.all("frmTitle").style.display="" 
} 
} 
</script> 
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="770" valign="top"> </td> 
<td width="10" onClick="switchSysBar()"><img id="aa" src="images/bl_1.gif" title="关闭/打开功能导航"></td> 
<td width="191" valign="top" id="frmTitle" name="frmTitle"> </td> 
</tr> 
</table>
Javascript 相关文章推荐
利用onresize使得div可以随着屏幕大小而自适应的代码
Jan 15 Javascript
JavaScript设置IFrame高度自适应(兼容各主流浏览器)
Jun 05 Javascript
JavaScript获取URL汇总
Jun 08 Javascript
JS实现仿QQ面板的手风琴效果折叠菜单代码
Sep 11 Javascript
基于JavaScript获取鼠标位置的各种方法
Dec 16 Javascript
bootstrap-treeview自定义双击事件实现方法
Jan 09 Javascript
JQuery判断正整数整理小结
Aug 21 jQuery
jQuery实现对网页节点的增删改查功能示例
Sep 18 jQuery
关于jQuery里prev()的简单操作代码
Oct 27 jQuery
JS数组降维的实现Array.prototype.concat.apply([], arr)
Apr 28 Javascript
Vue 解决父组件跳转子路由后当前导航active样式消失问题
Jul 21 Javascript
element-ui中el-upload多文件一次性上传的实现
Dec 02 Javascript
jquery如何把参数列严格转换成数组实现思路
Apr 01 #Javascript
form表单中去掉默认的enter键提交并绑定js方法实现代码
Apr 01 #Javascript
select标记美化--JS式插件、后期加载
Apr 01 #Javascript
js关闭父窗口时关闭子窗口
Apr 01 #Javascript
基于jQuery实现模拟页面加载进度条
Apr 01 #Javascript
javascript ie6兼容position:fixed实现思路
Apr 01 #Javascript
JavaScript中的onerror事件概述及使用
Apr 01 #Javascript
You might like
通过html表格发电子邮件
2006/10/09 PHP
PHP下使用CURL方式POST数据至API接口的代码
2013/02/14 PHP
PHP魔术方法__GET、__SET使用实例
2014/11/25 PHP
解析WordPress中控制用户登陆和判断用户登陆的PHP函数
2016/03/01 PHP
不错的一个日期输入 动态
2006/11/06 Javascript
JavaScript面向对象之静态与非静态类
2010/02/03 Javascript
js面向对象 多种创建对象方法小结
2012/05/21 Javascript
20款非常优秀的 jQuery 工具提示插件 推荐
2012/07/15 Javascript
JavaScript监听文本框回车事件并过滤文本框空格的方法
2015/04/16 Javascript
jQuery编写网页版2048小游戏
2017/01/06 Javascript
Popup弹出框添加数据实现方法
2017/10/27 Javascript
vue 运用mock数据的示例代码
2017/11/07 Javascript
Vue组件的使用及个人理解与介绍
2019/02/09 Javascript
angularjs请求数据的方法示例
2019/08/06 Javascript
原生javascript实现类似vue的数据绑定功能示例【观察者模式】
2020/02/24 Javascript
在VUE style中使用data中的变量的方法
2020/06/19 Javascript
[51:39]DOTA2-DPC中国联赛 正赛 Magma vs LBZS BO3 第二场 2月7日
2021/03/11 DOTA
[53:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Magma BO3 第一场 1月31日
2021/03/11 DOTA
寻找网站后台地址的python脚本
2014/09/01 Python
Python实现小数转化为百分数的格式化输出方法示例
2017/09/20 Python
解决pip install的时候报错timed out的问题
2018/06/12 Python
Python实现爬取马云的微博功能示例
2019/02/16 Python
解决在pycharm运行代码,调用CMD窗口的命令运行显示乱码问题
2019/08/23 Python
Pytorch: 自定义网络层实例
2020/01/07 Python
Python 实现日志同时输出到屏幕和文件
2020/02/19 Python
Python基于百度AI实现OCR文字识别
2020/04/02 Python
利用jupyter网页版本进行python函数查询方式
2020/04/14 Python
CSS3的常见transformation图形变化用法小结
2016/05/13 HTML / CSS
Marks & Spencer爱尔兰:英国马莎百货
2016/04/20 全球购物
企业办公室主任岗位职责
2014/02/19 职场文书
会务接待方案
2014/02/27 职场文书
经营目标管理责任书
2014/07/25 职场文书
励志演讲稿300字
2014/08/21 职场文书
幼儿教师个人总结
2015/02/05 职场文书
Tomcat用户管理的优化配置详解
2022/03/31 Servers
Win11 Beta 预览版 22621.575 和 22622.575更新补丁KB5016694发布(附更新内容大全)
2022/08/14 数码科技