// Tab切换栏
function setTab(name, m, n) {
for (var i = 1; i <= n; i++) {
var menu = document.getElementById(name + i);
var showDiv = document.getElementById("cont_" + name + "_" + i);
menu.className = i == m ? "on" : "";
showDiv.style.display = i == m ? "block" : "none";
}
}

调用的时候这样调用: onmousedown='setTab("two",2,3)'

Tab切换栏的更多相关文章

  1. 前端实现Tab切换栏

    tab切换,所需的 UI 只有两组元素 - Header 和 Tab,下面介绍几种不同的实现方法和他们的优缺点 本文主要说一些 CSS 的实现方法.最好的方法是 第四种 => label + i ...

  2. element UI中的tab切换栏

    html代码:(用的是el-tab组件) <el-tabs v-model="activeIndex" type="border-card" @tab-c ...

  3. 谈谈一些有趣的CSS题目(八)-- 纯CSS的导航栏Tab切换方案

    开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...

  4. 微信小程序tab切换,可滑动切换,导航栏跟随滚动实现

    简介 看到今日头条小程序页面可以滑动切换,而且tab导航条也会跟着滚动,点击tab导航,页面滑动,切导航栏也会跟着滚动,就想着要怎么实现这个功能 像商城类商品类目如果做成左右滑动切换类目用户体验应该会 ...

  5. CSS3 :target伪类实现Tab切换效果

    用:target伪类实现Tab切换效果真的非常简单!简单到什么程度呢?它只需要下面这些代码. style.css: .song-info { position: absolute; backgroun ...

  6. jq 版的tab切换

    ta切换是在前端中非常常见的一种效果,网上的效果很多.但是我觉得下面这种方法最好,把tab效果封装成一个函数 tabs,这个函数要配合jq使用. var tabs = function (tab, c ...

  7. 如何用RadioButton做一个底部的切换栏

    上面的效果是用Radio进行制作的,一般我们做底部的切换栏的时候需要让按钮和文字都有一个选中的状态,然后根据点击不同的按钮触发不同的页面,这里的页面一般都是fragment做的.这里我们不讨论复杂的东 ...

  8. vue仿淘宝订单状态的tab切换效果

    <div class="navigation">  //这里是通过循环遍历出来的数据,你需要根据index的值来判断你现在点击的是第几个tab栏导航,同时在js中写一个 ...

  9. vue2.0使用动态组件实现tab切换效果(vue-cli)

    <template> <div> <div>#动态组件实现tab切换效果#</div><br><br><br> &l ...

随机推荐

  1. mac 下 parallels 虚拟机 ubuntuServer 安装 parallels tools

    mac 下 parallels 虚拟机 ubuntuServer 安装 parallels tools 1. 先点击ubuntu 虚拟机右下角的设置 -----安装 parallels tools - ...

  2. Technical notes fornight

    1.8.2016 Royal trumpeters heralded the beginning of the annual ceremony, as Norway's royal family an ...

  3. (12)odoo各种提前期和时间

    1)Product的提前期    Customer Lead Time(sale_delay):客户提前期,指SO确认到向客户发货的天数,由于销售数量不同该时间也不同,因此,这里是一个平均时间.    ...

  4. Java并发编程:阻塞队列(转载)

    Java并发编程:阻塞队列 在前面几篇文章中,我们讨论了同步容器(Hashtable.Vector),也讨论了并发容器(ConcurrentHashMap.CopyOnWriteArrayList), ...

  5. linux开关端口问题

    linux开关端口问题: 我们知道一些常用的端口,比如mysql的端口为3306,sql的端口为:1433,以及tomcat的端口为 8008等等一样! 当这些端口在linux下是没有开启时,我们是无 ...

  6. jsp之 ---- 页面重定向和请求转发(笔记之深度说明)

    1.  HttpServletResponse对象的sendRedirect(String location)方法称作重定向. 如果location地址前面加上“/”,则表示  相对于Servlet容 ...

  7. org.springframework.web.servlet.PageNotFound No mapping found for HTTP request with URI [/AssetRepair/assetRepairController/test.do] in DispatcherServlet with name 'assetrepair'

    web.xml文件配置: xxx-servlet.xml 我们可以发现DispatcherServlet会处理"jsp"后缀的请求;而模型视图后缀也是jsp的 如果这样配置会报以下 ...

  8. poj1258 Agri-Net (prim+heap)

    题目链接:poj1258 Agri-Net 这题我上个月做过,是个大水题,今天看见有人用prim+heap做的,就学习了下. #include<cstdio> #include<cs ...

  9. html5的标签

    1.article与section div的区别 当一个标签只是为了样式化或者方便脚本使用时,应该使用 div . section 表示一段专题性的内容,一般会带有标题.,section 应用的典型场 ...

  10. State模式的经典应用场景:订单处理(c#实现)

    State模式在对象内部状态发生变化的时候,改变自身的行为,这通常是通过切换内部状态对象实现的,对象将自身在各个状态的行为推给了状态对象,从而解开了行为与对象的依赖. 场景描述 在经典的订单处理场景中 ...