点击隐藏页面左栏或右栏实现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 相关文章推荐
javascript之解决IE下不渲染的bug
Jun 29 Javascript
window.open被浏览器拦截后的自定义提示效果代码
Nov 19 Javascript
javascript css float属性的特殊写法
Nov 13 Javascript
escape、encodeURI 和 encodeURIComponent 的区别
Mar 02 Javascript
jquery禁止回车触发表单提交
Dec 12 Javascript
JQuery中DOM事件冒泡实例分析
Jun 13 Javascript
JQ实现新浪游戏首页幻灯片
Jul 29 Javascript
全面了解javascript三元运算符
Jun 27 Javascript
简单理解Vue条件渲染
Dec 03 Javascript
Vue+Jwt+SpringBoot+Ldap完成登录认证的示例代码
May 21 Javascript
node.js express捕获全局异常的三种方法实例分析
Dec 27 Javascript
vue路由缓存的几种实现方式小结
Feb 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
NOT NULL 和NULL
2007/01/15 PHP
PHP5.2中date()函数显示时间与北京时间相差8小时的解决办法
2009/05/28 PHP
php调用自己java程序的方法详解
2016/05/13 PHP
CI框架源码解读之利用Hook.php文件完成功能扩展的方法
2016/05/18 PHP
使用ThinkPHP的自动完成实现无限级分类实例详解
2016/09/02 PHP
PHP7扩展开发之基于函数方式使用lib库的方法详解
2018/01/15 PHP
Jsonp 跨域的原理以及Jquery的解决方案
2010/05/18 Javascript
19个很有用的 JavaScript库推荐
2011/06/27 Javascript
来自国外的30个基于jquery的Web下拉菜单
2012/06/22 Javascript
js判断页面中是否有指定控件的简单实例
2014/03/04 Javascript
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
2014/06/11 Javascript
纯javascript模仿微信打飞机小游戏
2015/08/20 Javascript
所见即所得的富文本编辑器bootstrap-wysiwyg使用方法详解
2016/05/27 Javascript
Vue2.x中的父子组件相互通信的实现方法
2017/05/02 Javascript
vue动画打包后失效问题的解决方法
2018/09/18 Javascript
微信小程序http连接访问解决方案的示例
2018/11/05 Javascript
微信小程序中悬浮窗功能的实现代码
2019/08/02 Javascript
node脚手架搭建服务器实现token验证的方法
2021/01/20 Javascript
解决python读取几千万行的大表内存问题
2018/06/26 Python
Python使用pickle模块实现序列化功能示例
2018/07/13 Python
Python实现的各种常见分布算法示例
2018/12/13 Python
python装饰器使用实例详解
2019/12/14 Python
Python字符串查找基本操作代码案例
2020/10/27 Python
英国领先的在线药房:Pharmacy First
2017/09/10 全球购物
Ivory Isle Designs美国/加拿大:婚礼和活动文具公司
2018/08/21 全球购物
旅游与酒店管理的自我评价分享
2013/11/03 职场文书
2014年乡镇妇联工作总结
2014/12/02 职场文书
2015年度销售个人工作总结
2015/03/31 职场文书
民主生活会意见
2015/06/05 职场文书
爱国主义主题班会
2015/08/14 职场文书
宣传部部长竞选稿
2015/11/21 职场文书
怎样做好公众演讲能力?
2019/08/28 职场文书
详解Redis复制原理
2021/06/04 Redis
使用qt quick-ListView仿微信好友列表和聊天列表的示例代码
2021/06/13 Python
实体类或对象序列化时,忽略为空属性的操作
2021/06/30 Java/Android
sql查询语句之平均分、最高最低分及排序语句
2022/05/30 MySQL