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 相关文章推荐
JSQL 基于客户端的成绩统计实现方法
May 05 Javascript
通过jQuery源码学习javascript(三)
Dec 27 Javascript
jQuery解决下拉框select设宽度时IE 6/7/8下option超出显示不全
May 27 Javascript
jquery ui dialog实现弹窗特效的思路及代码
Aug 03 Javascript
可兼容IE的获取及设置cookie的jquery.cookie函数方法
Sep 02 Javascript
Bootstrap项目实战之子栏目资讯内容
Apr 25 Javascript
Bootstrap零基础入门教程(三)
Jul 18 Javascript
iOS和Android用同一个二维码实现跳转下载链接的方法
Sep 28 Javascript
bootstrap组件之按钮式下拉菜单小结
Jan 19 Javascript
bootstrap table插件的分页与checkbox使用详解
Jul 23 Javascript
完美解决手机浏览器顶部下拉出现网页源或刷新的问题
Nov 30 Javascript
vue-devtools的安装步骤
Apr 23 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中的错误处理、异常处理机制分析
2012/05/07 PHP
PHP也能干大事之PHP中的编码解码详解
2015/04/20 PHP
jQuery textarea的长度进行验证
2009/05/06 Javascript
JavaScript下利用fso判断文件是否存在的代码
2010/12/11 Javascript
多浏览器兼容性比较好的复制到剪贴板的js代码
2011/10/09 Javascript
使用js检测浏览器的实现代码
2013/05/14 Javascript
jQuery实现鼠标滑过遮罩并高亮显示效果
2013/07/16 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
2014/01/10 Javascript
JavaScript实现Java中StringBuffer的方法
2015/02/09 Javascript
jQuery实现彩带延伸效果的网页加载条loading动画
2015/10/29 Javascript
论Bootstrap3和Foundation5网格系统的异同
2016/05/16 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
微信小程序 弹窗自定义实例代码
2017/03/08 Javascript
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
表格展示利器 Bootstrap Table实例代码
2017/09/06 Javascript
用Object.prototype.toString.call(obj)检测对象类型原因分析
2018/10/11 Javascript
nuxt中使用路由守卫的方法步骤
2019/01/27 Javascript
javascript操作元素的常见方法小结
2019/11/13 Javascript
微信小程序canvas实现签名功能
2021/01/19 Javascript
Python赋值语句后逗号的作用分析
2015/06/08 Python
使用PyCharm配合部署Python的Django框架的配置纪实
2015/11/19 Python
Python中的条件判断语句与循环语句用法小结
2016/03/21 Python
python实现三维拟合的方法
2018/12/29 Python
Django框架下静态模板的继承操作示例
2019/11/08 Python
pytorch三层全连接层实现手写字母识别方式
2020/01/14 Python
如何基于python把文字图片写入word文档
2020/07/31 Python
Python try except finally资源回收的实现
2021/01/25 Python
生产管理的三大手法
2013/11/11 职场文书
高级电工工作职责
2013/11/21 职场文书
2014年教师培训的自我评价
2014/01/03 职场文书
总经理岗位职责描述
2014/02/08 职场文书
求职面试个人自我评价
2014/02/28 职场文书
法律进学校实施方案
2014/03/15 职场文书
小学生感恩父母演讲稿
2014/08/28 职场文书
授权收款委托书
2014/09/23 职场文书
HTML+CSS 实现顶部导航栏菜单制作
2021/06/03 HTML / CSS