js原声快速实现选项卡
var Rea = document.getElementById("rep");
var ReaAll = Rea.querySelectorAll("li");
var Fall = document.getElementById("fall");
var FallAll = Fall.querySelectorAll("ul"); for(var i=0;i<ReaAll.length;i++){
ReaAll[i].index=i;
ReaAll[i].onclick=function(){
for(var i=0;i<ReaAll.length;i++){
ReaAll[i].className=" ";
FallAll[i].style.display="none";
}
this.className="avtion";
FallAll[this.index].style.display="block";
}
}
<ul class="row rep_ad" id="rep">
<li class="avtion">公告</li>
<li>知识库</li>
</ul>
<div id="fall">
<ul style="display:block;">
<li>11111111111111111</li>
<li>11111111111111111</li>
<li>11111111111111111</li>
<li>11111111111111111</li>
<li>11111111111111111</li>
</ul>
<ul>
<li>22222222222222222</li>
<li>22222222222222222</li>
<li>22222222222222222</li>
<li>22222222222222222</li>
<li>22222222222222222</li>
</ul>
</div>
</div>
一看就懂。走起!
js原声快速实现选项卡的更多相关文章
- js原声代码 轮播图
js轮播图 html部分:建立div,内嵌img标签,可以设置大小, <!doctype html> <html> <head> <meta charset= ...
- node.js 安装方法 以及 用原声搭建服务器
node.js 安装方法: 第一步: 64位的安装包网址: https://nodejs.org/dist/v4.4.3/node-v4.4.3-x64.msi 第二步: 进入命令提示框 输入 ...
- 基于js-spark-md5前端js类库,快速获取文件Md5值
js-spark-md5是歪果仁开发的东西,有点多,但是我们只要一个js文件即可,具体类包我存在自己的oschina上,下载地址:https://git.oschina.net/jianqingwan ...
- 比较原声socket 、GCDAsyncSocket
原声socket NSInputStream 输入流(OC)NSOutputStream 输出流(OC)1:通过c语言的输入输出流CFReadStreamRef/CFWirteStreamRef(输入 ...
- 基于 Node.js 平台,快速、开放、极简的 web 开发框架。
资料地址:http://www.expressjs.com.cn/ Express 基于 Node.js 平台,快速.开放.极简的 web 开发框架. $ npm install express -- ...
- js面向对象+一般方法的选项卡
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 关于ios原声嵌入web页面的问题
当在一个界面中既有原生又有web的时候,如果想让上下整体滑动的话,我们怎么确定web的高度呢,下面分享一下我的心得 首先在webView的代理方法中我们可以获取到加载完整个web页面的高度 - (vo ...
- 大D实例化model-->调用自定义类方法,大M调用原声model方法
class ContactsModel extends Model{ public function addxxx(){ } } $conmodel = D('contacts','Model'); ...
- 移动WEB模拟原声APP滑动删除
移动WEB模拟原声APP滑动删除 效果 代码 <!DOCTYPE html> <html lang="en"> <head> <meta ...
随机推荐
- Linux如何进行文件管理
Linux中的所有数据都被保存在文件中,所有的文件被分配到不同的目录.目录是一种类似于树的结构,称为文件系统.当你使用Linux时,大部分时间都会和文件打交道,通过本节可以了解基本的文件操作,如创建文 ...
- QQ远程桌面的使用
腾讯QQ怎样使用远程桌面: ---------------------- ----------------------
- 使用django开发博客过程记录5——日期归档和视图重写
针对每条博客的观看次数我么是使用django的Mixin实现的: def get(self, request, *args, **kwargs): last_visit = request.sessi ...
- 嵌入式 Linux下永久生效环境变量bashrc
嵌入式 Linux下永久生效环境变量bashrc 1) .bashrc文件 在linux系统普通用户目录(cd /home/xxx)或root用户目录(cd /root)下,用指令ls -al可以看到 ...
- MySQL点滴
1. 只安装Server和Workbench即可: 2. 安装时安装Windows服务,可以在“管理 > 服务”中开启关闭服务: 3. mysql -uroot -p1234 4. PHP Fa ...
- deiban8 sourcelist
deb http://ftp2.cn.debian.org/debian/ jessie main non-free contribdeb http://ftp2.cn.debian.org/debi ...
- Apache Shiro 学习记录5
本来这篇文章是想写从Factory加载ini配置到生成securityManager的过程的....但是貌似涉及的东西有点多...我学的又比较慢...很多类都来不及研究,我又怕等我后面的研究了前面的都 ...
- velocity中$springMacroRequestContext.getMessage($code)
在Java国际化(i18n)中, vm页面显示内容需要使用 #springMessage("title") 实际运行时发现页面输出$springMacroRequestContex ...
- EBS 中经常用到的一些值集
名称 值集 ...
- gulp工具rename
gulp 对文件批量重命名 gulp-rename重命名 var gulp = require('gulp'); var rename = require("gulp-rename" ...