tab页签
<div class="fl" id="newsBox">
<div class="tab1 grayBar">
<ul id="newsNav">
<li class="tab1_1 selected" index="0">
<h2>
<a href="WebPage/NewsList.aspx?CategoryID=221" target="_blank" title="更多">公告栏</a></h2>
</li>
<li class="tab1_2" index="1">
<h2>
<a href="WebPage/Scene.aspx" target="_blank" title="点击显示更多招聘会信息">招聘会</a></h2>
</li>
<li class="tab1_3" index="2">
<h2>
<a href="http://www.gxrcpx.com/" target="_blank">就业培训</a></h2>
</li>
<li class="tab1_4" index="3">
<h2>
<a href="http://sydw.gxrc.com" target="_blank" title="更多">事业单位</a></h2>
</li>
<li class="tab1_5" index="4">
<h2>地市动态</h2>
</li>
</ul>
</div>
<div id="NewsArea-content" class="cl base_border">
<div class="newsList">
</div>
<div class="newsList undis">
</div>
<div class="newsList undis">
</div>
<div class="newsList undis">
</div>
<div class="newsList undis">
</div>
<div class="newsList undis" style="display:none;">
</div>
</div>
</div>
//页签
function Tabs(tabNav, tabContent, selClass) {
var index = 0;
var tabContents = $("#" + tabContent + " > div");
var tabNavs = $("#" + tabNav + " li");
tabNavs.each(function () {
var $this = $(this);
$this.attr("index", index);
index++;
}).mouseover(function () {
var $this = $(this);
tabContents.hide();
tabNavs.removeClass(selClass);
$this.addClass(selClass);
tabContents.eq(parseInt($this.attr("index"))).show();
});
}
Tabs("newsNav", "NewsArea-content", "selected");
tab页签的更多相关文章
- 使用原生js与jQuery分别实现一个简单的tab页签
tab页签通常适用于空间有限而内容较多同时兼顾页面美观度不给用户一种信息过量视觉疲劳的情形.使用面非常广,下面我们用两种方法简单实现之. 首先,构建页面元素.页签的可点击部分我们通常用列表来承载,包括 ...
- Tab页签切换
js之tab页签切换效果 现在web网站,很多地都需要用到tab页签. 示例: $(document).ready(function(){ va ...
- 用于实现tab页签切换页面的angular路由复用策略
使用场景 打开菜单页面的时候,出现对应页面的页签.切换页签,原来的页面信息状态保留,关闭页签则保留的信息删除.使用路由复用策略,保存路由快照.实现效果如图所示 实现过程 概述: 1.在app.modu ...
- bootStrap中Tab页签切换
关于$().tab()一般用来实现标签页和胶囊链接内容片段的切换,或是相关内容的页面导航: <ul class="nav nav-tabs" id="myTab&q ...
- ASP.NET MVC搭建项目后台UI框架—4、tab多页签支持
目录 ASP.NET MVC搭建项目后台UI框架—1.后台主框架 ASP.NET MVC搭建项目后台UI框架—2.菜单特效 ASP.NET MVC搭建项目后台UI框架—3.面板折叠和展开 ASP.NE ...
- 值得分享的Bootstrap Ace模板实现菜单和Tab页效果(转)
Ace模板地址:http://code.google.com/p/ace-engine/wiki/AceTemplate(有时会打不开) Ace英文官网:http://wrapbootstrap.co ...
- Activity“ 阻止自动弹出软键盘”的方法 -尤其是对于Tab页下的!
我的activity是Tab页签下的~! 所以应把代码加在继承于TabActivity的那个activity中!!而不是由点击Tab页启动的那个activity <activity androi ...
- JavaScript选项卡/页签/Tab的实现
选项卡,也称页签,英文用Tab(Module-Tabs)表示.Tab将不同的内容重叠放在一个布局块内,重叠的内容区里每次只有其中一个是可见的. Tab可以在相同的空间里展示更多的信息,它把相似的主题分 ...
- EBS OAF开发中怎样实现功能页签(Global Tab)
EBS OAF开发中怎样实现功能页签(Global Tab) (版权声明.本人原创或者翻译的文章如需转载.如转载用于个人学习,请注明出处.否则请与本人联系,违者必究) 功能页签的实现不须要不论什么编码 ...
随机推荐
- Spring框架加案例
依赖: <!-- https://mvnrepository.com/artifact/org.springframework/spring-beans --> <dependenc ...
- MySQL 计算时间差函数 TIMESTAMPDIFF、DATEDIFF
一.TIMESTAMPDIFF 支持天.小时.秒等 selet TIMESTAMPDIFF(hour,odl_time,now()); 计算old_time与现在时间的小时差. 二.DATEDIFF ...
- 三十四.MySQL主从同步 、主从同步模式
mysql51:192.168.4.51 主 mysql52:192.168.4.52 从 mysql50:192.168.4.50 客户机 1.MySQL一主一从 1.1 51,52 安装m ...
- [HNOI2002]营业额统计 II
https://www.luogu.org/problemnew/show/2234 将权值离散化,以权值为下标建立权值线段树 #include <bits/stdc++.h> using ...
- Educational Codeforces Round 72
目录 Contest Info Solutions A. Creating a Character B. Zmei Gorynich C. The Number Of Good Substrings ...
- 「CF150E」Freezing with Style「点分治」「单调队列」
题意 给定一颗带边权的树,求一条边数在\(L\).\(R\)之间的路径,并使得路径上边权的中位数最大.输出一条可行路径的两个端点.这里若有偶数个数,中位数为中间靠右的那个. \(n, L, R\leq ...
- zabbix (6) 为主机添加监控项,触发器,动作
先了解一下zabbix的相关概念 监控项(iterms):一个具体的指标,比如某个人的体重. 键(key):通过定义(自定义或者zabbix自带)的key获取相应指标的具体值,比如这个人的体重50斤 ...
- docker安装ubuntu以后无ifconfig命令解决办法
解决: 1.apt-get update 2.apt install net-tools #ifcongig 3.apt install iputils-ping # ping
- Dockerfile HEALTHCHECK详解
Dockerfile中使用HEALTHCHECK的形式有两种: 1.HEALTHCHECK [options] CMD command(本次详细解释) 2.HEALTHCHECK NODE 意思是禁止 ...
- ASP.NET MVC传递Model到视图的多种方式之通用方式的使用
ASP.NET MVC传递Model到视图的多种方式总结——通用方式的使用 有多种方式可以将数据传递到视图,如下所示: ViewData ViewBag PartialView TempData Vi ...