简单通用的JS滑动门代码


Posted in Javascript onDecember 19, 2008
<UL id=tabMainNav> 
<LI class=selected id=tab_GameinfoNav onmousemove="show_tab(0)"><SPAN><A id=tab_1 href="#">{$PHPCMS[sitename]}</A></SPAN></LI> 
<LI id=tab_ShareEmailNav onmousemove="show_tab(1)"><SPAN><A id=tab_2 href="#">由 Email 分享</A></SPAN> </LI> 
<LI id=tab_ShareIMNav onmousemove="show_tab(2)"><SPAN><A id=tab_3 href="#">由 IM 分享</A></SPAN> </LI> 
<LI id=tab_BlogNav onmousemove="show_tab(3)"><SPAN><A id=tab_4 href="#">发布到博客/网站</A></SPAN> </LI> 
</UL> 
<UL ID=''tabContent''> 
<LI></LI> 
<LI></LI> 
<LI></LI> 
<LI></LI> 
</UL>
 
JS代码
<script language="javascript"> 
function show_tab(id){ 
var tabMainNav; 
var tabContent; 
tabMainNav=document.getElementById('tabMainNav'); 
tabContent=document.getElementById('tabContent'); 
for(i=0;i<tabMainNav.children.length;i++){ 
if(i==id){ 
tabMainNav.children[i].className='selected'; 
tabContent.children[i].className=''; 
}else{ 
tabMainNav.children[i].className=''; 
tabContent.children[i].className='hidden'; 
} 
} 
} 
</script>

CSS代码,对这两个CSS修改一下就可以显示不同的样式了
.hidden{
}
.selected{
}
Javascript 相关文章推荐
IE6/7/8中Option元素未设value时Select将获取空字符串
Apr 07 Javascript
JQuery 获取json数据$.getJSON方法的实例代码
Aug 02 Javascript
基于jquery自定义的漂亮单选按钮RadioButton
Nov 19 Javascript
使用POST方式弹出窗口的两种方法示例介绍
Jan 29 Javascript
原生js实现移动开发轮播图、相册滑动特效
Apr 17 Javascript
js实现数组转换成json
Jun 26 Javascript
js中DOM三级列表(代码分享)
Mar 20 Javascript
Angularjs为ng-click事件传递参数
Jun 15 Javascript
JS点击缩略图整屏居中放大图片效果
Jul 04 Javascript
Vue代码整洁之去重方法整理
Aug 06 Javascript
js实现随机圆与矩形功能
Oct 29 Javascript
详解Vue2的diff算法
Jan 06 Vue.js
比较全的JS checkbox全选、取消全选、删除功能代码
Dec 19 #Javascript
Javascript 获取LI里的内容
Dec 17 #Javascript
FLASH 广告之外的链接
Dec 16 #Javascript
用tip解决Ext列宽度不够的问题
Dec 13 #Javascript
兼容ie和firefox js关闭代码
Dec 11 #Javascript
IE和Firefox下javascript的兼容写法小结
Dec 10 #Javascript
js 禁用浏览器的后退功能的简单方法
Dec 10 #Javascript
You might like
献给php初学者(入门学习经验谈)
2010/10/12 PHP
php curl常见错误:SSL错误、bool(false)
2011/12/28 PHP
php反射应用示例
2014/02/25 PHP
laravel框架之数据库查出来的对象实现转化为数组
2019/10/23 PHP
拖动一个HTML元素
2006/12/22 Javascript
(转载)JavaScript中匿名函数,函数直接量和闭包
2007/05/08 Javascript
juqery 学习之三 选择器 层级 基本
2010/11/25 Javascript
js判断IE6/IE7/FF的代码[XMLHttpRequest]
2011/02/16 Javascript
修改好的jquery滚动字幕效果实现代码
2011/06/22 Javascript
简洁Ajax函数处理(示例代码)
2013/11/15 Javascript
jquery实现在光标位置插入内容的方法
2015/02/05 Javascript
jQuery validate插件实现ajax验证重复的2种方法
2016/01/22 Javascript
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
JavaScript简单实现合并两个Json对象的方法示例
2017/10/16 Javascript
Vue-component全局注册实例
2018/09/06 Javascript
React手稿之 React-Saga的详解
2018/11/12 Javascript
JS实现简单的点赞与踩功能示例
2018/12/05 Javascript
iphone刘海屏页面适配方法
2019/05/07 Javascript
Python的设计模式编程入门指南
2015/04/02 Python
Python实现Mysql数据库连接池实例详解
2017/04/11 Python
python 使用while写猜年龄小游戏过程解析
2019/10/07 Python
python使用SQLAlchemy操作MySQL
2020/01/02 Python
tensorflow之获取tensor的shape作为max_pool的ksize实例
2020/01/04 Python
pytorch载入预训练模型后,实现训练指定层
2020/01/06 Python
解决pytorch 保存模型遇到的问题
2021/03/03 Python
CSS3实现内凹圆角的实例代码
2017/05/04 HTML / CSS
全球最大的中文旅行网站:去哪儿网
2017/11/16 全球购物
大学生大二自我鉴定
2013/10/28 职场文书
大学生饮食配送创业计划书
2014/01/04 职场文书
感恩节活动方案
2014/01/27 职场文书
幼儿园评语大全
2014/04/17 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
新闻发布会策划方案
2014/06/12 职场文书
抗震救灾标语
2014/06/26 职场文书
中学图书馆工作总结
2015/08/11 职场文书
计算机实训心得体会
2016/01/14 职场文书