javascript实现的多个层切换效果通用函数实例


Posted in Javascript onJuly 06, 2015

本文实例讲述了javascript实现的多个层切换效果通用函数。分享给大家供大家参考。具体实现方法如下:

function ChangeDiv(tagId,tagName,divId,divName,zDivCount,tagclass,divclass) {
for(i=0;i<=zDivCount;i++) {
document.getElementById(divName+i).style.display="none";
document.getElementById(divName+i).className='';
document.getElementById(tagName+i).className='';
}
document.getElementById(divName+divId).style.display="block";
document.getElementById(tagName+tagId).className=tagclass;
document.getElementById(divName+divId).className=divclass;
}

tagId,tagName为鼠标单击的控制层的id和名称 divId,divName为被控制要显示和隐藏的层的id和名称 zDivCount为显示和隐藏的层的个数-1(如果是5个层则为4)

tagclass,divclass分别为控制层的样式 和被控制层的样式

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript中window.open在原来的窗口中打开新的窗口(不同名)
Nov 15 Javascript
JS实现的表格行鼠标点击高亮效果代码
Nov 27 Javascript
Bootstrap每天必学之导航条
Nov 27 Javascript
js实现卡片式项目管理界面UI设计效果
Dec 08 Javascript
关于获取DIV内部内容报错的原因分析及解决办法
Jan 29 Javascript
关于JavaScript限制字数的输入框的那些事
Aug 14 Javascript
Bootstrap基本组件学习笔记之下拉菜单(7)
Dec 07 Javascript
jQuery Ajax请求后台数据并在前台接收
Dec 10 Javascript
JS实现简单的天数计算器完整实例
Apr 28 Javascript
Angular6 Filter实现页面搜索的示例代码
Dec 02 Javascript
使用Angular9和TypeScript开发RPG游戏的方法
Mar 25 Javascript
JavaScript this关键字的深入详解
Jan 14 Javascript
javascript动态添加删除tabs标签的方法
Jul 06 #Javascript
Jsonp post 跨域方案
Jul 06 #Javascript
javascript运动详解
Jul 06 #Javascript
浅谈jQuery中height与width
Jul 06 #Javascript
jQuery中$this和$(this)的区别介绍(一看就懂)
Jul 06 #Javascript
浅谈Javascript实现继承的方法
Jul 06 #Javascript
JavaScript保存并运算页面中数字类型变量的写法
Jul 06 #Javascript
You might like
dede3.1分页文字采集过滤规则详说(图文教程)
2007/04/03 PHP
mysql limit查询优化分析
2008/11/12 PHP
php eval函数用法总结
2012/10/31 PHP
PHP与MYSQL中UTF8编码的中文排序实例
2014/10/21 PHP
discuz图片顺序混乱解决方案
2015/07/29 PHP
php 使用 __call实现重载功能示例
2019/11/18 PHP
html下载本地
2006/06/19 Javascript
jQuery1.6 类型判断实现代码
2011/09/01 Javascript
js常用代码段整理
2011/11/30 Javascript
jQuery 图片切换插件(代码比较少)
2012/05/07 Javascript
JS滚轮事件onmousewheel使用介绍
2013/11/01 Javascript
javascript 模拟坦克大战游戏(html5版)附源码下载
2014/04/08 Javascript
javascript进行四舍五入方法汇总
2014/12/16 Javascript
jQuery中$.ajax()和$.getJson()同步处理详解
2015/08/12 Javascript
js实现仿网易点击弹出提示同时背景变暗效果
2015/08/13 Javascript
浅谈jquery页面初始化的4种方式
2016/11/27 Javascript
详解nodejs 文本操作模块-fs模块(三)
2016/12/22 NodeJs
jquery uploadify如何取消已上传成功文件
2017/02/08 Javascript
微信小程序教程系列之设置标题栏和导航栏(7)
2020/06/29 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
2017/05/10 Javascript
JS手机端touch事件计算滑动距离的方法示例
2017/10/26 Javascript
通过实例讲解JS如何防抖动
2019/06/15 Javascript
微信小程序实现时间戳格式转换
2020/07/20 Javascript
详解vue之自行实现派发与广播(dispatch与broadcast)
2021/01/19 Vue.js
python中使用print输出中文的方法
2018/07/16 Python
Python线程之定位与销毁的实现
2019/02/17 Python
python实现nao机器人手臂动作控制
2019/04/29 Python
浅谈pyqt5在QMainWindow中布局的问题
2019/06/21 Python
Python实现密码薄文件读写操作
2019/12/16 Python
浅谈Keras中shuffle和validation_split的顺序
2020/06/19 Python
CSS3的 fit-content实现水平居中
2017/09/07 HTML / CSS
后勤人员自我评价怎么写
2013/09/19 职场文书
2014年团总支工作总结
2014/11/21 职场文书
2019年干货:自我鉴定
2019/03/25 职场文书
Java基础之this关键字的使用
2021/06/30 Java/Android
Python制作一个随机抽奖小工具的实现
2021/07/07 Python