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 插件 还可以,但是 ...
随机推荐
- 1级搭建类103-Oracle 12c 单实例 FS(12.2.0.1+RHEL 7)公开
项目文档引子系列是根据项目原型,制作的测试实验文档,目的是为了提升项目过程中的实际动手能力,打造精品文档AskScuti. 项目文档引子系列目前不对外发布,仅作为博客记录.如学员在实际工作过程中需提前 ...
- ISCC2018 Reverse & Pwn writeup
Reference:L1B0 Re RSA256 春秋欢乐赛原题..flag都不变的 给了三个加密文件和公钥证书public.key,可以使用openssl进行处理 $openssl rsa -pub ...
- 第十周 11.28 psp0
课堂测试总结 学生:马小心 日期:2017.11.28 作业号 日期 过程 估计数据 实际数据 累计数据 时间 ...
- 数据预处理 | 使用 Pandas 统一同一特征中不同的数据类型
出现的问题:如图,总消费金额本应该为float类型,此处却显示object 需求:将 TotalCharges 的类型转换成float 使用 pandas.to_numeric(arg, errors ...
- Appium学习1-安装
Appium简介 Appium 是一个开源的.跨平台的测试框架,可以用来测试 Native App.混合应用.移动 Web 应用(H5 应用)等,也是当下互联网企业实现移动自动化测试的重要工具.App ...
- [SDOI2008] 校门外的区间 - 线段树
U T 即将区间 \(T\) 范围赋值为 \(1\) I T 即将区间 \(U - T\) 范围赋值为 \(0\) D T 即将区间 \(T\) 赋值为 \(0\) C T 由于 \(S=T-S=T( ...
- try_except_finally
blog: python中的try/except/else/finally python文档:错误和异常 与其他语言相同,在python中,try/except语句主要是用于处理程序正常执行过程中出 ...
- thinkphp中如何用路由调用前台html界面
先上图片看看基本的文件位置 1.首先在application\route.php中定义路由 <?php use think\Route; Route::get("home", ...
- HDU1312 Red and Black(dfs+连通性问题)
这有一间铺满方形瓷砖的长方形客房. 每块瓷砖的颜色是红色或者黑色. 一个人站在一块黑色瓷砖上, 他可以从这块瓷砖移动到相邻(即,上下左右)的四块瓷砖中的一块. 但是他只能移动到黑色瓷砖上,而不能移动到 ...
- X shell安装 以及使用
X shell 百度搜索 X shell 然后下载软件 然后会进入主页面