<html>

<head>

<script type="text/javascript">

 <!--

    function ShowTabs(ID) {

        for (i = 0; i < 2; i++) {

            if (i == ID) {

                document.getElementById("TabTitle" + i).className = "titlemouseover";

                document.getElementById("Tab" + i).style.display = "";

            }

            else {

                document.getElementById("TabTitle" + i).className = "tabtitle";

                document.getElementById("Tab" + i).style.display = "none";

            }

        }

    }

 //-->

</script>

</head>

<body>

<ul>

<ul>

<li class="titlemouseover" id="TabTitle0" onmouseover="ShowTabs(0)">测试</li>

<li class="tabtitle" id="TabTitle1" onmouseover="ShowTabs(1)" >test</li>

</ul>  

<div id="Tab0" >

    <ul>

        <li>测试</li>

    </ul>

</div>

<div id="Tab1"style="display: none;" >

    <ul>

        <li>test</li>

    </ul>

</div>

</body>

</html>

鼠标滑过TAB选项卡切换demo 可拓展的更多相关文章

  1. 微信小程序Tab选项卡切换大集合

    代码地址如下:http://www.demodashi.com/demo/14028.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  2. Axure实现Tab选项卡切换功能

    这几天用Axure画原型图的过程中,须要实现Tab选项卡切换的效果,但Axure中并没有类似于Tab控件的部件,所以能够用Axure中的动态面板(Dynamic Panel)来实现. 本文以已经汉化的 ...

  3. jQuery实现TAB选项卡切换特效简单演示

    本文实例为大家分享jQuery实现TAB选项卡切换特效,供大家参考,具体内容如下 1.tab切换 on ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 1 ...

  4. react tab选项卡切换

    Tab选项卡切换是个很常见也很简单的小功能,用原生js和jq去写的话可能不到20行代码就搞定so easy.但是用react去实现就没那么容易了(是自己react比较菜).由于最近在重新学习react ...

  5. 纯CSS实现tab选项卡切换

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta cont ...

  6. 下拉菜单效果和tab选项卡切换

    //下拉菜单效果和tab选项卡切换. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " ...

  7. 纯js实现网页tab选项卡切换效果

    纯js实现网页tab选项卡切换效果 百度搜索     js 点击菜单项就可以切换内容的效果

  8. jQuery Tab选项卡切换代码

    jQuery Tab选项卡切换代码是一款简单的jquery tab选项卡切换网页特效代码样式,可以修改tab选项卡相关样式. 代码下载:http://www.huiyi8.com/sc/10863.h ...

  9. 7月新的开始 - LayUI的基本使用 - Tab选项卡切换显示对应数据

    LayUI tab选项卡+page展示 要求:实现tab选项卡改变的同时展示数据也跟着改变 实现条件: 1. 选项卡 [官网 – 文档/示例 – 页面元素 – 选项卡] 2.数据表格 [官网 – 文档 ...

随机推荐

  1. Iptables入门教程

    转自:http://drops.wooyun.org/tips/1424 linux的包过滤功能,即linux防火墙,它由netfilter 和 iptables 两个组件组成. netfilter ...

  2. 【Tomcat】linux下实时查看tomcat运行日志

    今天在部署一个项目到linux服务器的时候一直报错,可是在日志文件中也没有记录.但是在本地测试的时候都没有错误,在windoesServer服务器上也没错误,实在找不到原因,因此想的实时查看tomca ...

  3. springboot收集

    Spring Boot实战:拦截器与过滤器 参考:https://blog.csdn.net/m0_37106742/article/details/64438892 https://www.ibm. ...

  4. MongoDB存储引擎（上）——MMAPv1

    3.0版本以前,MongoDB只有一个存储引擎——MMAP,MongoDB3.0引进了一个新的存储引擎——WiredTiger,同时对原有的MMAP引擎进行改进,产生MMAPv1存储引擎,并将其设置为 ...

  5. NFV产品如何才能走向规模商用

    作者简介:王晔,烽火通信科技股份有限公司ICT网络产品线NFV产品总监,高级工程师,研究方向为SDN\NFV\MEC\AI\光通信. 自2013年AT&T率先提出DOMAIN 2.0网络转型计 ...

  6. 浅谈Java字符串

    从概念上而言,Java字符串就是Unicode字符序列.由于Java没有内置的字符串类型,而是在标准Java类库中提供了一个预定义类String,每个用双引号的括起来的字符串都是String类的一个实 ...

  7. spring解决乱码

    spring提供的工具类解决乱码问题 在web.xml配置中添加如下代码: <!--乱码处理--> <filter> <filter-name>encodingFi ...

  8. [转]Visual Studio 2012 编译错误【error C4996: 'scanf': This function or variable may be unsafe. 】的解决方案

    原文地址:http://www.cnblogs.com/gb2013/archive/2013/03/05/SecurityEnhancementsInTheCRT.html 在VS 2012 中编译 ...

  9. 跟着实例学习设计模式（7）-原型模式prototype（创建型）

    原型模式是创建型模式. 设计意图:用原型实例指定创建对象的类型,并通过拷贝这个原型来创建新的对象. 我们使用构建简历的样例的类图来说明原型模式. 类图: 原型模式主要用于对象的复制.它的核心是就是类图 ...

  10. YII RBAC基于角色的访问控制

    基于角色的访问控制( Role-Based Access Control ),是一种简单的而又强大的集中访问控制.基于Yii Framework 的 authManager 组件实现了分等级的 RBA ...