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

点击隐藏页面左栏或右栏(同一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>

赞 (0)

相关推荐

  • [js+css]点击隐藏层,点击另外层不能隐藏原层

    使用一个全局变量保存上一次打开的对象 var old=null; function changemenu(mydiv){ var obj = document.getElementById(mydiv); if (old!=null&&old!=obj) old.style.display='none'; old=obj; if (obj.style.display=='none'){ obj.style.display='block'; }else{ obj.style.display=

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

    点击隐藏页面左栏或右栏(同一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&

  • 前端页面文件拖拽上传模块js代码示例

    前端页面文件拖拽上传模块js代码示例

    最近给卫生局做一个表格上传/可视化系统,算是小有成果.今天把项目中的文件拖拽上传模块分离出来,做了一个独立的小demo,并把相关代码打包上传到了我的github中,为了其他学习者和开发者提供拙见. gitHub地址:https://github.com/codeplay2015/dragToUpload 由于代码中我的注释很详尽,所以具体逻辑实现及不介绍了,大家直接看代码及能明白.现在简单列一个功能清单和一些用到的知识点清单: 模态框 文件的批量上传 使用formData API 封装数据 并通

  • 下载站常用的点击下载地址提示设hao123为首页的js代码

    下载站常用的点击下载地址提示设hao123为首页的js代码

    一般情况我们在不修改原来页面布局的情况下,如果原来的点击区域有id的话比较好,要不要修改下,这样比较好控制,否则没个下载地址的a标签里面都要加onclick事件了. 效果图: 核心代码: 复制代码 代码如下: <script>function GetCookie (name){  var arg = name + "=";  var alen = arg.length;  var clen = document.cookie.length;  var i = 0;  whi

  • 在页面预览客户端本地图片的js代码(兼容FF IE)

    公司最近有个项目有这样的需求我才发现我之前写的 如何通过JS获取用户本地图片路径 这篇文章里所使用的方法只支持本地页面预览本地图片 有一种解决方法是上传到服务器后返回相对路径 但是效率是个问题,编程复杂度也会提高 直接上demo代码 为更多有这种需求又苦于找不到解决方案的同行提供源码 转载请注明出处 我这里还有更多的其他问题的解决方案供更多人参考 get file input full path function getFullPath(obj) { var newPreview = docum

  • JQuery控制div外点击隐藏而div内点击不会隐藏的方法

    本文实例讲述了JQuery控制div外点击隐藏而div内点击不会隐藏的方法.分享给大家供大家参考.具体如下: 比如有个div其id为body,实现在div外点击隐藏,div内点击不隐藏,采用jQuery实现如下: 复制代码 代码如下: $("#body").click(function(e) {      $(this).show();          e.stopPropagation();  });  $(document).click(function(event) {   

  • 微信小程序BindTap快速连续点击目标页面跳转多次问题处理

    问题描述: 1)wxml片段 <view bindtap="loadMulti"> <text>连续点击,加载多次</text> </view> <view bindtap="loadOnce"> <text>连续点击,加载一次</text> </view> 2)js代码片段 loadMulti:function(e) { wx.navigateTo({ url: '/p

  • 固定右栏宽度, 左栏内容先出现同时自适应宽度的布局

    工作原理 #wrapper必须触发hasLayout,不然有时里面的内容会浮得怪怪的,我直接用float的,可以用其他方式.其实如果只是要做到这个例子要的效果连#wrapper都可以不要.#left定义100%宽度并利用margin:0 0 0 -200px把左边整块放在偏移入左边200px处,再利用#innerLeft的margin:0 0 0 200px再把内容撑出来,#right只是简单的浮动,#innerRight米多大作用,只是习惯性保留着,除了可以让我们的控制更简单点,还可以为下次改

  • Vue实现 点击显示再点击隐藏效果(点击页面空白区域也隐藏效果)

    平时项目中,经常会做一些下拉菜单等效果,这种效果可能会需要通过一个按钮来控制显示隐藏,并且当点击页面其他空白区域时,也要将其隐藏. 简单写个Demo <!-- 按钮 --> <button @click.stop="ShowHidden = !ShowHidden">显示或隐藏</button> <!-- 下拉列表 --> <div v-if="ShowHidden" @click.stop="&quo

  • Vue路由切换时的左滑和右滑效果示例

    如何实现Vue路由切换时的左滑和右滑效果,因为原作者ustbhuangyi老师的两个慕课项目中都没有这样的效果,于是突发奇想要做这个功能,看了看QQ.微信都没这样的效果,最后发现SegmentFault(思否) 和掘金两个app都有这样的效果,就以此为参考开始做了. transition 首先看看官网淡入淡出动画的例子: <div id="demo"> <button v-on:click="show = !show"> Toggle <

  • ASP.NET中iframe框架点击左边页面链接 右边显示链接页面内容

    ASP.NET中iframe框架点击左边页面链接 右边显示链接页面内容

    ASP.NET中iframe框架点击左边页面链接,右边则显示链接页面内容,具体实现内容如下 先看看效果图: 首先是主页面main.aspx <body style="background-color: #AFEEEE"> <form id="form1" runat="server"> <div> <center> <h1> 后台管理界面 </h1> <span sty

随机推荐