// 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. dede 调用四级导航

    一.修改文件:\include\taglib目录下的channel.lib.php,请将以下代码全部复制替换上述文件 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 ...

  2. 20145218《Java程序设计》第一周学习总结

    20145218 <Java程序设计>第一周学习总结 教材学习内容总结 今天下午看了Java学习的视频,感觉很是新奇,之前觉得Java学起来是艰难枯燥的,但通过第一章的学习觉得如果自己可以 ...

  3. js 数组的判断

    <javascript语言精粹>中的 var is_array = function(value){ return value && //判断值是否为真,不接受null和其 ...

  4. struts 标签库注解

    在struts2中有着一套像html一样的标签,俗称struts2标签,大多数公司使用ssh都是使用html标签,但为了保持项目的统一性,有的公司还是使用的struts2的标签,下面是一些常用的str ...

  5. 172. Factorial Trailing Zeroes -- 求n的阶乘末尾有几个0

    Given an integer n, return the number of trailing zeroes in n!. Note: Your solution should be in log ...

  6. js事件知识整理

    鼠标事件 鼠标移动到目标元素上的那一刻,首先触发mouseover 之后如果光标继续在元素上移动,则不断触发mousemove 如果按下鼠标上的设备(左键,右键,滚轮……),则触发mousedown ...

  7. this和super关键字

    this关键字: 1.引用成员变量 2.通过this(参数列表)调用类的重载的构造方法 3.返回对象的值:使用return this,来返回某个类的引用. super关键字: 1.super是一个引用 ...

  8. BZOJ3996 [TJOI2015]线性代数

    就是求$D = A \times B \times A^T - C \times A^T$ 展开也就是$$D = \sum_{i, j} A_i * A_j * B_{i, j} - \sum_{i} ...

  9. 陈朱兴-js写法【案例】:

    ajax请求: 一.从服务器端请求数据: var url = '';url = 'https://api.weixin.qq.com/sns/oauth2/access_token?appid='+ ...

  10. checkbox改成radio效果，单选，取消

    $(function () {            var allBox = $(":checkbox");            allBox.click(function ( ...