点击隐藏页面左栏或右栏实现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 相关文章推荐
分析Node.js connect ECONNREFUSED错误
Apr 09 Javascript
页面载入结束自动调用js函数示例
Sep 23 Javascript
js实现带关闭按钮始终显示在网页最底部工具条的方法
Mar 02 Javascript
JS实现带提示的星级评分效果完整实例
Oct 30 Javascript
详解js私有作用域中创建特权方法
Jan 25 Javascript
设置jQueryUI DatePicker默认语言为中文
Jun 04 Javascript
javascript 分号总结及详细介绍
Sep 24 Javascript
浅谈js对象的创建和对6种继承模式的理解和遐想
Oct 16 Javascript
Google 爬虫如何抓取 JavaScript 的内容
Apr 07 Javascript
ReactNative之FlatList的具体使用方法
Nov 29 Javascript
jQuery实现模拟搜索引擎的智能提示功能简单示例
Jan 27 jQuery
Vue.js中使用Vuex实现组件数据共享案例
Jul 31 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
PHP 时间转换Unix时间戳代码
2010/01/22 PHP
php+ajax实现带进度条的上传图片功能【附demo源码下载】
2016/09/14 PHP
jquery tools 系列 scrollable学习
2009/09/06 Javascript
轻轻松松学JS调试(不下载任何工具)
2010/04/14 Javascript
初识javascript 文档碎片
2010/07/13 Javascript
一个可拖拽列宽表格实例演示
2012/11/26 Javascript
jquery获取checkbox的值并post提交
2015/01/14 Javascript
jQuery实现仿美橙互联两级导航菜单的方法
2015/03/09 Javascript
分享十五款 jQuery 社交网络分享插件
2015/05/16 Javascript
webix+springmvc session超时跳转登录页面
2016/10/30 Javascript
用vue构建多页面应用的示例代码
2017/09/20 Javascript
layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例
2017/09/22 Javascript
在vue项目中安装使用Mint-UI的方法
2017/12/27 Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
2018/09/18 Javascript
详解Vuex下Store的模块化拆分实践
2019/07/31 Javascript
layui-table表复选框勾选的所有行数据获取的例子
2019/09/13 Javascript
vue之debounce属性被移除及处理详解
2019/11/13 Javascript
IDEA配置jQuery, $符号不再显示黄色波浪线的问题
2020/10/09 jQuery
python爬虫 猫眼电影和电影天堂数据csv和mysql存储过程解析
2019/09/05 Python
python中的split、rsplit、splitlines用法说明
2020/10/23 Python
sklearn中的交叉验证的实现(Cross-Validation)
2021/02/22 Python
浅谈CSS3特性查询(Feature Query: @supports)功能简介
2017/07/31 HTML / CSS
项目计划书范文
2014/01/09 职场文书
大学生学习2014年全国两会心得体会
2014/03/12 职场文书
服务行业口号
2014/06/11 职场文书
篮球社团活动总结
2014/06/27 职场文书
踏青活动策划方案
2014/08/19 职场文书
汽车修理厂管理制度
2015/08/05 职场文书
如何写好开幕词?
2019/06/24 职场文书
2019中小学生安全过暑期倡议书
2019/06/24 职场文书
少儿励志名言(80句)
2019/08/14 职场文书
详解MySQL InnoDB存储引擎的内存管理
2021/04/08 MySQL
发工资啦!教你用Python实现邮箱自动群发工资条
2021/05/10 Python
详解解Django 多对多表关系的三种创建方式
2021/08/23 Python
win11无法登录onedrive错误代码0x8004def7怎么办 ?
2022/04/05 数码科技
关于Redis的主从复制及哨兵问题
2022/06/16 Redis