jquery滚动到顶部
<script>
$.fn.scrollTo = function (options) { var defaults = { toT: , //滚动目标位置 durTime: , //过渡动画时间 delay: , //定时器时间 callback: null //回调函数 }; var opts = $.extend(defaults, options), timer = null, _this = this, curTop = _this.scrollTop(), //滚动条当前的位置 subTop = opts.toT - curTop, //滚动条目标位置和当前位置的差值 index = , dur = Math.round(opts.durTime / opts.delay), smoothScroll = function (t) { index++; var per = Math.round(subTop / dur); if (index >= dur) { _this.scrollTop(t); window.clearInterval(timer); if (opts.callback && typeof opts.callback == 'function') { opts.callback(); } return; } else { _this.scrollTop(curTop + index * per); } }; timer = window.setInterval(function () { smoothScroll(opts.toT); }, opts.delay); return _this; }; $("body").scrollTo({ toT: });
</script>
jquery滚动到顶部的更多相关文章
- 基于jQuery实现页面滚动时顶部导航显示隐藏效果
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...
- [jquery]判断页面滚动到顶部和底部(适用于手机web加载)
//判断页面滚动到顶部和底部 $(window).scroll(function(){ var doc_height = $(document).height(); var scroll_top = ...
- js平滑滚动到顶部,底部,指定地方
[原文链接] 采用锚点进行页面中的跳转的确很方便,但是要想增加网页的效果,可以使用jquery中的animate,实现滚动的一个动作,慢慢的滚动到你想跳转到的位置,从而看起来会非常高大上. [示例演示 ...
- js+JQuery实现返回顶部功能
很多网站上都有返回顶部的效果,本文阐述如何使用jquery实现返回顶部按钮. 首先需要在顶部添加如下html元素: <p id="back-to-top"><a ...
- jQuery滚动条回到顶部或指定位置
jQuery滚动条回到顶部或指定位置 在很多网站,为了增强用户体验,我们会看到回到顶部的按钮,不用手动拖拽滚动条就能回到顶部,非常方便.下面就介绍用jquery实现的滚动到顶部的代码 $(functi ...
- JQuery 实现返回顶部效果
首先要里了解一下几个知识 $(window).scrollTop() ---滚动条距顶部距离 fadeIn() 方法使用淡入效果来显示被选元素,假如该元素是隐藏的. fadeOut() 方法使用淡出效 ...
- [js常用]页面滚动的顶部,指定位置或底部,平滑滚动
js平滑滚动到顶部.底部.指定地方 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- javascript+JQuery实现返回顶部功能
很多网站上都有返回顶部的效果,本文阐述如何使用jquery实现返回顶部按钮. 首先需要在顶部添加如下html元素: <p id="back-to-top"><a ...
- 一款基于jquery固定于顶部的导航
今天给大家分享一款基于jquery固定于顶部的导航,这款导航当浏览器滚动条位于顶部时,导航高度较高,当浏览器滚动向下滚动时,导航高度自动减低,并位于顶部.效果图如下: 在线预览 源码下载 实现的代 ...
随机推荐
- C# ffmpeg 视频处理格式转换具体案例
C# ffmpeg 视频处理格式转换 C# ffmpeg 视频处理格式转换avi到MP4格式 1.代码如下: using System;using System.Diagnostics; namesp ...
- 004 springboot文件上传
关于文件上传,在spring cloud会再经过配置文件的处理,在spring boot则不需要,在这里写一个文件上传的接口. 单文件上传,如果以后写多文件上传再进行补充. 1.文件目录 2.控制器程 ...
- iptables 4张表 5条链
- Flutter AspectRatio、Card 卡片组件
Flutter AspectRatio 组件 AspectRatio 的作用是根据设置调整子元素 child 的宽高比. AspectRatio 首先会在布局限制条件允许的范围内尽可能的扩展,widg ...
- VAE论文学习
intractable棘手的,难处理的 posterior distributions后验分布 directed probabilistic有向概率 approximate inference近似推 ...
- opencv4 mask_rcnn模型调(c++)
昨天有人问我关于调用mask_rcnn模型的问题,忽然想到最近三个月都没用opencv调用训练好的mask_rcnn模型了,今晚做个尝试,所以重新编译了 opencv4,跑个案例试试 #include ...
- js禁止退出当前页面
禁止用户退出网页,就一个添加窗体历史状态方法,代码很简单,但是建议大家不要去使用,会给用户带来不友好的体验,我这里只是学习这种方法,看到自己代码上有也知道在哪里改变这些代码,所以分享一下: 实现原理: ...
- 第07组 Alpha冲刺(2/4)
队名:秃头小队 组长博客 作业博客 组长徐俊杰 过去两天完成的任务:完成人员分配,初步学习Android开发 Github签入记录 接下来的计划:继续完成Android开发的学习,带领团队进行前后端开 ...
- python基础篇(二)
PYTHON基础篇(二) if:else,缩进 A:if的基础格式和缩进 B:循环判断 C:range()函数和len()函数 D:break,contiue和pass语句 for,while循环 函 ...
- 大数据架构(PB级)
1.随着互联网快速发展,数据量的快速膨胀,我们日增3000多亿数据量,因此需要针对PB级存储.几百TB的增量数据处理架构设计 2.系统逻辑划分总图: 暂不便透露 3.系统架构图: 4.大数据计算引擎我 ...