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 相关文章推荐
jQuery学习笔记之jQuery的DOM操作
Dec 22 Javascript
深入理解JavaScript系列(8) S.O.L.I.D五大原则之里氏替换原则LSP
Jan 15 Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
Mar 26 Javascript
各种常用的JS函数整理
Oct 25 Javascript
JavaScript中使用webuploader实现上传视频功能(demo)
Apr 10 Javascript
parabola.js抛物线与加入购物车效果的示例代码
Oct 25 Javascript
vue中使用微信公众号js-sdk踩坑记录
Mar 29 Javascript
用 js 写一个 js 解释器过程详解
Aug 02 Javascript
js中的this的指向问题详解
Aug 29 Javascript
es6 for循环中let和var区别详解
Jan 12 Javascript
Vue的props父传子的示例代码
May 20 Javascript
深入理解Vue的数据响应式
May 15 Vue.js
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
SESSION信息保存在哪个文件目录下以及能够用来保存什么类型的数据
2012/06/17 PHP
深入php数据采集的详解
2013/06/02 PHP
Thinkphp中import的几个用法详细介绍
2014/07/02 PHP
php mailer类调用远程SMTP服务器发送邮件实现方法
2016/03/04 PHP
Yii2针对指定url的生成及图片等的引入方法小结
2016/07/18 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
php对象工厂类完整示例
2018/08/09 PHP
JavaScript全局函数使用简单说明
2011/03/11 Javascript
JQuery与JSon实现的无刷新分页代码
2011/09/13 Javascript
基于jQuery和CSS3制作数字时钟附源码下载(jquery篇)
2015/11/24 Javascript
javaScript事件机制兼容【详细整理】
2016/07/23 Javascript
JavaScript SHA512加密算法详细代码
2016/10/06 Javascript
sublime text配置node.js调试(图文教程)
2017/11/23 Javascript
vue 系列——vue2-webpack2框架搭建踩坑之路
2017/12/22 Javascript
Vue v2.4中新增的$attrs及$listeners属性使用教程
2018/01/08 Javascript
webpack手动配置React开发环境的步骤
2018/07/02 Javascript
vue监听键盘事件的快捷方法【推荐】
2018/07/11 Javascript
webpack的CSS加载器的使用
2018/09/11 Javascript
微信小程序官方动态自定义底部tabBar的例子
2019/09/04 Javascript
vue+axios实现post文件下载
2019/09/25 Javascript
解决vue单页面多个组件嵌套监听浏览器窗口变化问题
2020/07/30 Javascript
python实现360皮肤按钮控件示例
2014/02/21 Python
浅谈Django REST Framework限速
2017/12/12 Python
python绘制直线的方法
2018/06/30 Python
如何利用Boost.Python实现Python C/C++混合编程详解
2018/11/08 Python
Python调用OpenCV实现图像平滑代码实例
2020/06/19 Python
美国汽车交易网站:Edmunds
2016/08/17 全球购物
青年文明号服务承诺
2014/03/31 职场文书
感恩节活动策划方案
2014/05/16 职场文书
总经理任命书范本
2014/06/05 职场文书
校园文化标语
2014/06/18 职场文书
村委会贫困证明范文
2014/09/21 职场文书
广告设计专业毕业生自我鉴定
2014/09/27 职场文书
银行贷款收入证明
2014/10/17 职场文书
团组织推优材料
2014/12/29 职场文书
2015年信息中心工作总结
2015/05/25 职场文书