显示页面tab.jsp

</ div >
</ body > </ html >  

tab.css

ul ,li { margin:0px;
padding:0px;
list-style:none;
}
li { float:left;
background-color:#66CC00;
margin-right:2px; //这个是设置标签之间的间距
padding:5px;
border:1px solid white;
height:20px;
color:white;
 
}
.listli { background-color:#663333;
border:1px solid #663333;
 
}
div { clear:left;
width:300px;
height:100px;
background-color:#663333;
border-top:0px;
color:white;
display:none;
}
 

.divarea { display:block; }

 
 
tab.js

);
$( this ).mouseout( function (){
clearTimeout(timeout);
});
});
}); });
 
 
效果图为这样

JS实现标签页效果(配合css)不同标签下对应不同div的更多相关文章

  1. jquery实战---标签页效果

    在前面的博客中,小编主要简单的介绍了jquery的一些基本知识,今天这篇博文,小编继续来学习jquery的相关知识,今天我们来学习一个标签页的小例子,相关源码小编已经上传,有需要的小伙伴可以自己去下载 ...

  2. Angular实现多标签页效果(路由重用)

    1.需求 做了几年的MES系统,从ASP.NET WebForm至MVC,系统决定了用户界面必须为标签页方式实现,因为用户在进行一项操作的时候很有可能会进行其它的操作,比如查询之类的.如果按MVC的方 ...

  3. 实战Jquery(四)--标签页效果

            这两天完毕了实战四五六的样例,实例四是标签页的实现方法,实例五是级联菜单下拉框,实例六是窗体效果,都是web层经常使用的效果.越到后面越发认为技术这东西,就是一种思路的展现,懂了要实现 ...

  4. DevExpress navBarControl 和 xtraTabbedMdiManager实现浏览器标签页效果

    一:navBarControl 属性设置 工具箱中的Navigation & Layout选项卡下找到NavBarControl,拖到窗体中 工具箱中添加2个imageCollection.分 ...

  5. idea标签页多行显示+设置标签页上限

    idea标签页多行显示+设置标签页上限 Setting--Editor--General--Editor Tabs

  6. turn.js 图书翻页效果

    今天用turn.js 做图书的翻页效果遇到问题: 图片路径总是出错 调了一天,总算调出来了 我用的thinkphp,其他的不知道是不是一样 三 个地方要改动: 1.后台查出地址 注意的地方:1.地址要 ...

  7. js实现多标签页效果

    点击导航按钮切换div的内容 html代码: <div class="tabs"> <ul id="tab"> <li>&l ...

  8. jQuery中turn.js(翻页效果)学习笔记

    Turn.js是一个内置的jQuery翻页插件1 html中引入<script type="text/javascript" src="js/turn.js&quo ...

  9. JS 获取元素、修改元素/css样式/标签属性、简单事件、数据类型

    基本使用 写在Script 标签里 引入外部js文件:<script src=" "></script> console.log(" " ...

随机推荐

  1. 关于C#静态构造函数的几点说明

    静态构造函数是C#的一个新特性,其实好像很少用到.不过当我们想初始化一些静态变量的时候就需要用到它了.这个构造函数是属于类的,而不是属于哪里实例的,就是说这个构造函数只会被执行一次.也就是在创建第一个 ...

  2. POJ 2975 Nim 尼姆博弈

    题目大意:尼姆博弈,求先手必胜的情况数 题目思路:判断 ans=(a[1]^a[2]--^a[n]),求ans^a[i] < a[i]的个数. #include<iostream> ...

  3. jquery 控制文本输入的字数

    <textarea maxlength="200" id="remarks" onkeyup="title_len();">&l ...

  4. Factory and AbstractFactory ——抽象与具体的分离

    Factory and AbstractFactory——抽象与具体的分离 面向对象标准关注于抽取一系列事物的共同行为,组建一个基类.行为再划分成两类: 1:现在及以后不太可能会变化的行为. 2:以后 ...

  5. UIViewContentMode 图文解说

    在iOS应用开发中我们常常要对视图的contentMode属性进行设置,尤其在使用UIImageView视图时设置这个属性的概率很高.我们知道contentMode的类型是UIViewContentM ...

  6. Co-Debugging JNI with Android Studio and Visual Studio

    Tutorials > Android > Integration with other tools > Co-Debugging JNI with Android Studio a ...

  7. 在windows系统用odbc连接

    当连接的数据出现失败时,出现数据库别名仍然存在,但还是要用这个别名重新建立连接 在windows客户端,用输入db2cmd输入c:\Users\yexuxia>db2 list db direc ...

  8. 3d 人物残像

    前言: gameunity 框架 还在继续完善中,0.2版本将会是一次 重大的里程碑. 正文: 哈哈,大家一定流汗了吧.请原谅我为自己代言. 好了,今天我要讲的是  3d人物残像. 首先我来说下 目前 ...

  9. HDU 1010 Temper of the bone(深搜+剪枝)

    Tempter of the Bone Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) ...

  10. java 数据流

    Example10_11.java import java.io.*; public class Example10_11 { public static void main(String args[ ...