HTML锚点参考
锚点参考
<ul class="banner-pic">
<li style="background: url(../Content/images/new_cert/recruit/banner_test.jpg) no-repeat center; height: 355px" title="了解招聘">
<a href="javascript:;">@*火热资讯*@</a>
</li>
<li style="background: url(../Content/images/new_cert/recruit/banner_test.jpg) no-repeat center; height: 355px" title="网上申请">
<a href="javascript:;">@*全程服务*@</a>
</li>
<li style="background: url(../Content/images/new_cert/recruit/banner_test.jpg) no-repeat center; height: 355px" title="笔试">
<a href="javascript:;">@*真题资料*@</a>
</li>
<li style="background: url(../Content/images/new_cert/recruit/banner.png) no-repeat center; height: 355px" title="课程介绍">
<a href="javascript:;">@*精品课程*@</a>
</li>
</ul>
var aLi = null;
$(function () {
aLi = $(".tab").find("li");
aLi.click(function () {
if ($(this).index() == 0) {
removerClass();
aLi.addClass("one-active");
$(".content-box").find(".font").hide();
$(".content-box").find(".font").eq($(this).index()).show();
} else if ($(this).index() == 1) {
removerClass();
aLi.addClass("two-active");
$(".content-box").find(".font").hide();
$(".content-box").find(".font").eq($(this).index()).show();
} else if ($(this).index() == 2) {
removerClass();
aLi.addClass("three-active");
$(".content-box").find(".font").hide();
$(".content-box").find(".font").eq($(this).index()).show();
} else if ($(this).index() == 3) {
removerClass();
aLi.addClass("four-active");
$(".content-box").find(".font").hide();
$(".content-box").find(".font").eq($(this).index()).show();
} else if ($(this).index() == 4) {
removerClass();
aLi.addClass("five-active");
$(".content-box").find(".font").hide();
$(".content-box").find(".font").eq($(this).index()).show();
} }) //banner大图切换
$(".banner").slide({
titCell: ".num ul",
mainCell: ".banner-pic",
effect: "fold",
autoPlay: true,
delayTime: 700,
autoPage: true
}); var aBannerLi = $(".banner-pic").find("li"); aBannerLi.click(function () {
if ($(this).get(0).title == "了解招聘") {
$("html,body").animate({ scrollTop: $(".s-news").offset().top }, 900);
aLi.eq(0).trigger("click");
}
if ($(this).get(0).title == "网上申请") {
$("html,body").animate({ scrollTop: $(".s-news").offset().top }, 900);
aLi.eq(1).trigger("click");
}
if ($(this).get(0).title == "笔试") {
$("html,body").animate({ scrollTop: $(".s-news").offset().top }, 900);
aLi.eq(2).trigger("click");
}
if ($(this).get(0).title == "课程介绍") {
$("html,body").animate({ scrollTop: $(".s-products").offset().top }, 900);
}
}) });
HTML锚点参考的更多相关文章
- HTML锚点参考II
锚点使用:<a href="#a">会直接找到id为a的元素的位置,不需要其他设置.如此简单! <a href="#a"> <li ...
- github的markdown页内锚点以及本地资源链接
页内锚点参考 https://my.oschina.net/antsky/blog/1475173 [aaa](#2-aaabbb) 字母小写,.去掉,空格换成- 本地资源链接 [aaa](docs/ ...
- SyncML 同步协议 感谢 周鹏(我只是做一个备份)
SyncML 同步协议(SyncML Sync Protocol) 翻译周鹏 2006-1-24 摘要 本规范定义了SyncML客户和服务的同步协议. 它规范了怎样使用SynML表示层协议去完成Syn ...
- NGUI 3.0.7的新锚点系统设置不好就会造成显示错误的错觉
每次设置NGUI控件的锚点时,都需要刷新一下窗口,不然就会造成显示错误的错觉. 同时,NGUI控件设置锚点的参考对象为一个物体时还需要调整其控件大小,不然也会造成显示错误的错觉.
- js 定位到某个锚点
js 定位到某个锚点 html页面内可以设置锚点,锚点定义 <a name="firstAnchor">&nsbp;</a> 锚点使用 <a ...
- URL锚点HTML定位技术机制
一.锚点是什么 锚点就等同于火影中的“飞雷神之术”,我们先看百科中锚点的解释: 使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定主题处或顶部.然后可以创建到这些命名锚记的链接,这些链接可快 ...
- URL锚点定位
我们都知道<a>标签中的url属性有三种值: 绝对 URL - 指向另一个站点(比如 href="http://www.example.com/index.htm") ...
- osgearth earth文件规范-符号参考
osgearth earth文件规范-符号参考 osgEarth用样式表渲染要素和注记. 本文档列出了可在样式表中使用的所有符号属性.不是每个符号是适用于每种情况:这只是一个主列表. 跳转到符号: • ...
- html锚点 点击跳转到页面指定位置
本来是在看阮大神写的ajax教程,突然发现点击目录文字会跳转到相对应的文本内容,于是乎激发了我的兴趣. 这个究竟怎么做的,刚开始看的时候一知半解,找度娘就是:"点击跳转到页面指定位置&quo ...
随机推荐
- wampserver 绑定域名 外部可以正常访问
wampserver使用的apache 绑定都一样 绑定的域名xuechao2010.gicp.net 端口是8989 系统是win7 64位 1.绑定域名 端口 在apache上 D:\wam ...
- OC-SEL
SEL SEL对应方法的地址 _cmd代表当前方法 1. 方法的存储位置 每个类的方法列表都存储在类对象中 每个方法都有一个与之对应的SEL类型的对象 根据一个SEL对象就可以找到方法的地址,进而调 ...
- ajax实例详解
页面通过ajax和后台进行数据交互是非常简洁且方便的.特别是封装成json数据格式. 此处使用的是jQuery的ajax var params = { version:new Date().getTi ...
- vim查找替换
http://www.cnblogs.com/ltang/articles/2034291.html %: 表示百分百,表示所有 行的意思... 如果不指定行号, 则表示当前行; g: 表示一行中的所 ...
- CF455C Civilization (并查集)
CF456E Codeforces Round #260 (Div. 1) C Codeforces Round #260 (Div. 2) E http://codeforces.com/conte ...
- SQL笔记 - CTE递归实例(续):显示指定部门的全称
前一篇文章中已经可以取得所有部门的全称,但现在又有个新的需求: 只想得到某一个部门的部门全称,虽然可以用where条件来过滤,但是会有点小浪费. 这时我们可以从后往前找,先看下效果: 最后一条就是,行 ...
- 使用jQuery的Scrollify插件实现鼠标滚轮或者手势滑动到页面下一节点部分
有时我们需要做一个单页面介绍产品特性,而单页面内容非常多且页面非常长,为了快速定位到产品特性节点,我们使用js侦听用户滚轮事件,当用户触发滚轮滑动或者使用手势触屏滑动时,即可定位到相应的节点.一款jQ ...
- linux socket
linux 的 C 库路径为 /usr/include,可以直接查看源码,也可以通过 "man 头文件名" 来学习,需要查看某个函数如 bind() ,则只需要 man 2 bi ...
- Html书写规范
#cnblogs_post_body ol { padding-left: 0px; } body { line-height: 1.6; } body, th, td, button, input, ...
- 一个简单的猜大小的小游戏 python
初学python,用python写了一个简单的猜大小的小游戏 #!/usr/bin/env python #-*- coding:utf-8 -*- print "------------- ...