锚的效果的实现
来源:互联网 发布:党员队伍结构持续优化 编辑:程序博客网 时间:2024/05/21 13:55
http://gouwu.sogou.com/baokuan 大家可以瞅瞅这个网址里面的效果
这个锚的效果 当然了啦 京东什么的也很多 在这就不说css的效果了直接上js
var totop_index1=function(){
var TOPID="#float_nav";
var lilength=$(TOPID+" ul li").length;
var locationlen=$(".low_pro_area").length;//因为网页上每个块都是class 就这获取就好了
var location =new Array();//用来存储每一个锚需要定位到的网页的位置
for(var i=0;i<locationlen;i++){
location[i]=$(".low_pro_area:eq("+i+")").offset().top;//找出需要定位的位置offset不晓得的可以谷歌啊
}
$(TOPID+" ul li").each(function(){//调用jquery的each方法
$(this).click(function(){
var arg=$(this).attr("id");
var num=arg.split("_")[1];//也算是命名的一点小技巧啦,这样就能定位点击的是哪一个锚了
if(num!=9){
$('body,html').animate({ scrollTop: location[num] }, 800);//点击就可以返回指定的位置
}else{
$('body,html').animate({ scrollTop: 0 }, 800);//点击下方的返回顶部
}
});
});
- 锚的效果的实现
- 半透明效果的实现
- 玻璃效果的实现
- 实现分组效果的
- 实现放大镜的效果
- 分页效果的实现
- 气泡效果的实现
- 平行四边形的效果实现
- 导航效果的实现
- 刮刮乐效果的实现
- 实现画布的效果
- 分页效果的实现
- stickup效果的实现
- 抽屉效果的实现
- 常用效果的实现
- 动画效果的实现
- card效果的实现
- 窗体动态效果的实现
- JavaScript规范
- leetcode 日经贴,Cpp code -Factorial Trailing Zeroes
- 2015腾讯面试总结
- 在rational rose类图的工具栏中没有表示聚合和组合关系的工具
- CososJS学习笔记(1) 环境配置(填坑版,让你少走弯路!)
- 锚的效果的实现
- jQuery EasyUI CheckBoxTree的级联选中
- C# - 扩展函数
- C++ COM编程之什么是接口
- MYSQL安装过程中,卡在Attemptting to start serverce解决方案
- Tracking using Multilevel Quantizations MQT算法学习
- C++笔记(1)explicit构造函数
- Android Fragment 基本介绍
- scp远程文件传输