js实现页面下拉后展示导航,以及点击导航自动滑动到相关页面
//监控,下拉750px后展示导航
$(window).scroll(function(){
var $this = $(this);
var targetTop = $(this).scrollTop();
if(targetTop > 750){
$("#fixed-menu").css('display','block');
}else{
$("#fixed-menu").css('display','none');
}
}); //点击导航自动活动到页面
$(".link1").click(function(){
$('body,html').animate({'scrollTop':$(".fwjs").offset().top},800)
}); $(".link2").click(function(){
$('body,html').animate({'scrollTop':$("#zzlc").offset().top},800)
}); $(".link3").click(function(){
$('body,html').animate({'scrollTop':$(".clzb").offset().top},800)
}); $(".link4").click(function(){
$('body,html').animate({'scrollTop':$("#xzfxq").offset().top},800)
}); $(".link5").click(function(){
$('body,html').animate({'scrollTop':$("#gwtd").offset().top},800)
}); $(".link6").click(function(){
$('body,html').animate({'scrollTop':$("#cjwt").offset().top},800)
});
js实现页面下拉后展示导航,以及点击导航自动滑动到相关页面的更多相关文章
- JS列表的下拉菜单组件(仿美化控件select)
JS列表的下拉菜单组件(仿美化控件select) 2014-01-23 23:51 by 龙恩0707, 1101 阅读, 6 评论, 收藏, 编辑 今天是农历23 也是小年,在这祝福大家新年快乐!今 ...
- 代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)
代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...
- 页面滚动动态加载数据,页面下拉自动加载内容 jquery
<!DOCTYPE=html> <html> <head> < script src="js/jquery.js" type=" ...
- Jquery页面滚动动态加载数据,页面下拉自动加载内容
<!DOCTYPE=html> <html> <head> <script src="js/jquery.js" type="t ...
- 微信小程序 禁止ios页面下拉下滑滚动 出现空白的情况
项目需要做了一个图片拖动指定组件上删除,和排序的功能android测试正常, ios会出现拖动图片页面也跟着下滑的尴尬情况. 查文档下拉刷新配置默认是关闭的,后经查找文档发现在本页面page.json ...
- bootstrap-multiselect.js多选下拉框初始化时默认选中初始值
bootstrap-multiselect.js多选下拉框默认值设置 一.案例数据格式 二.HTML代码 <select id="msgRoles" multiple=&q ...
- jq自定义下拉菜单,当用户点击非自身元素(下拉菜单)本身时关闭下拉菜单
jq自定义下拉菜单,当用户点击非自身元素(下拉菜单)本身时关闭下拉菜单 截图: 代码如下: //关闭用户菜单 $(document).mousedown(function(e){ var _con = ...
- H5页面基于iScroll.js插件实现下拉刷新,上拉加载更多
前言 在我之前的项目中,页面总是干巴巴的,用户的体验不是特别完美,我也是一直觉得把设计师给到的psd做出来就好,很少考虑用户的感受.我喜欢看不同的App,操作每个步骤,观赏每个能和我互动的交互设计效果 ...
- H5页面下拉加载更多(实用版)
近期在做一个H5网站,需要下拉加载更多产品列表的功能.百度搜索了好久,什么说法都有,什么插件都有. 醉了.基本上每一个能直接拿来用的. 最后发现: 1.dropload.js 插件 还可以,但是 ...
随机推荐
- Android 判断APP前台,后台运行
public void checkAppState() { ActivityManager am = (ActivityManager) getSystemService(ACTIVITY_SERVI ...
- jQuery---tab栏切换
tab栏切换 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UT ...
- shell输入输出
输出 一.echo命令介绍 1.功能:将内容输出到默认显示设备 2.语法:echo [-ne] [字符串] :输出的字符串以空格隔开,默认会加上换行符 3.选项 -n 不要在最后自动换行 -e 如果字 ...
- 杭电oj 1087——super jump!jump!jump(java实现)
question:Super Jumping! Jumping! Jumping! 意思就是找一串数字中的和最大子串 思路:创建另一个数组,每一项是路径数组对应项之前最大子串的和,然后遍历此数组找出最 ...
- (转)git fetch + merge 和 git pull 的区别
转自:http://blog.csdn.net/a19881029/article/details/42245955 Git fetch和git pull都可以用来更新本地库,它们之间有什么区别呢? ...
- vue源码的入口(四)
我们之前提到过 Vue.js 构建过程,在 web 应用下,我们来分析 Runtime + Compiler 构建出来的 Vue.js,它的入口是 src/platforms/web/entry-ru ...
- redis 有序集合(set),无需集合(zset)
1.set(无序集合)无序集合每个元素都是string元素的唯一性,不能重复没有修改操作 1.增加 sadd key value1 value2 value3... 2.获取 smembers key ...
- R-CNN系列阅读笔记
之前感觉研究的还是不够透彻,这次彻底从头到尾研究一下. R-CNN系列 R-CNN 本文发表于2014年. 背景及整体框架 背景:将CNN在图像分类领域的成功(2012年)应用于目标检测上面.检测问题 ...
- Python入门8 —— 逻辑运算符补充
一:优先级:not > and > or 1.not与紧跟其后的那个条件是不可分割的 2.如果条件语句全部由纯and.或纯or链接,按照从左到右的顺序依次计算即可 print(True a ...
- 在SQL2005中修改数据库名称
SQL Server 2005中有个数据库HT_WisdomDataBaseCenter,现在要将其改名为HT_NBSBOneNetcs1步骤:(1) 分离数据库:打开management studi ...