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添加输出窗口的代码
Feb 07 Javascript
使用jQuery插件创建常规模态窗口登陆效果
Aug 23 Javascript
为开发者准备的10款最好的jQuery日历插件
Feb 04 Javascript
JS函数重载的解决方案
May 13 Javascript
Bootstrap实现默认导航栏效果
Sep 21 Javascript
浅谈js在html中的加载执行顺序,多个jquery ready执行顺序
Nov 26 Javascript
vue.js事件处理器是什么
Mar 20 Javascript
bootstrap动态调用select下拉框的实例代码
Aug 09 Javascript
Vue项目查看当前使用的elementUI版本的方法
Sep 27 Javascript
小程序实现人脸识别功能(百度ai)
Dec 23 Javascript
基于Vue2-Calendar改进的日历组件(含中文使用说明)
Apr 14 Javascript
JavaScript实现省份城市的三级联动
Feb 11 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
一个PHP的ZIP压缩类分享
2014/05/04 PHP
PHP获取文件的MD5值并判断是否被修改的例子
2014/06/19 PHP
php出现web系统多域名登录失败的解决方法
2014/09/30 PHP
php中get_cfg_var()和ini_get()的用法及区别
2015/03/04 PHP
PHP中的traits简单使用实例
2015/05/13 PHP
Zend Framework基于Command命令行建立ZF项目的方法
2017/02/18 PHP
js 点击按钮弹出另一页,选择值后,返回到当前页
2010/05/26 Javascript
jquery 插件学习(四)
2012/08/06 Javascript
THREE.JS入门教程(3)着色器-下
2013/01/24 Javascript
分享JavaScript获取网页关闭与取消关闭的事件
2013/12/13 Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
2014/01/23 Javascript
纯css+js写的一个简单的tab标签页带样式
2014/01/28 Javascript
js结合正则实现国内手机号段校验
2015/06/19 Javascript
jQuery实现的点赞随机数字显示动画效果(附在线演示与demo源码下载)
2015/12/31 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
2016/11/23 Javascript
js 性能优化之算法和流程控制
2017/02/15 Javascript
Angular2 Service实现简单音乐播放器服务
2017/02/24 Javascript
使用async、enterproxy控制并发数量的方法详解
2018/01/02 Javascript
vue多页面开发和打包正确处理方法
2018/04/20 Javascript
vue内置组件transition简单原理图文详解(小结)
2018/07/12 Javascript
vue 实现LED数字时钟效果(开箱即用)
2019/12/08 Javascript
一篇文章带你从零快速上手Rollup
2020/09/07 Javascript
利用python将pdf输出为txt的实例讲解
2018/04/23 Python
用于业余项目的8个优秀Python库
2018/09/21 Python
python实现图书借阅系统
2019/02/20 Python
Python itertools.product方法代码实例
2020/03/27 Python
Python Tornado之跨域请求与Options请求方式
2020/03/28 Python
python调用API接口实现登陆短信验证
2020/05/10 Python
基于python实现复制文件并重命名
2020/09/16 Python
HTML5拖放API实现自动生成相框功能
2020/04/07 HTML / CSS
经典禁毒标语
2014/06/16 职场文书
思想作风纪律整顿心得体会
2014/09/04 职场文书
成绩报告单家长评语
2014/12/30 职场文书
关于迟到的检讨书
2015/05/06 职场文书
经典爱情感言
2015/08/03 职场文书
MySQL 8.0 之不可见列的基本操作
2021/05/20 MySQL