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固定于顶部的导航,这款导航当浏览器滚动条位于顶部时,导航高度较高,当浏览器滚动向下滚动时,导航高度自动减低,并位于顶部.效果图如下: 在线预览 源码下载 实现的代 ...
随机推荐
- 多层If语句 和 表格驱动 的对比
网文提到表格驱动,总喜欢拿一层if做例子,然而这样未免也太简单. 下文是三层缩进的if和表驱动比较,大家可自行判断优劣. 业务是这样的,某景点分旺季票价和淡季票价,淡季票为旺季的一半,15岁以下孩子再 ...
- win10: windows+E 改回打开我的电脑
之前习惯使用windows+E来打开我的电脑,用了win10之后按windows+E打开的却是“快速访问”文件夹,很不习惯,可用下列办法改回: 1.打开“查看”选项卡,选择”选项“按钮. 2.在“常规 ...
- C++ STL排序问题
/* stl排序 */ #include <iostream> #include <map> #include <vector> #include <list ...
- kinova roslaunch j2s7s300_moveit_config j2s7s300_demo.launc logs1
luo@luo-ThinkPad-W530:~$ luo@luo-ThinkPad-W530:~$ luo@luo-ThinkPad-W530:~$ luo@luo-ThinkPad-W530:~$ ...
- osgearth 编译日志
1>------ 已启动生成: 项目: ZERO_CHECK, 配置: Debug x64 ------1> Checking Build System1> CMake does n ...
- 教孩子学编程 Python
教孩子学编程 Python 目录 第1 章 Python 基础:认识环境 111 认识Python 312 用Python 编写程序 513 运行Python 程序 514 本章小结 615 编程 ...
- 安卓apk反编译
在win环境反编译安卓APP的.apk文件 安卓apk 反编译为 Java源码图文教程 Android安全攻防战,反编译与混淆技术完全解析(上)
- Java Audio : Playing PCM amplitude Array
转载自:http://ganeshtiwaridotcomdotnp.blogspot.com/2011/12/java-audio-playing-pcm-amplitude-array.html ...
- IIS+PHP本地开发环境配置
打开Win7系统自带IIS.如图只要点击两下,CGI一定要勾选上!完成后打开浏览器输入127.0.0.1测试一下,如果能打开页面说明iis开启成功. 安装PHP.不同版本的PHP会有所不同,这里使用的 ...
- 15点睛Spring4.1-TaskExecutor
转发:https://www.iteye.com/blog/wiselyman-2212679 15.1 TaskExecutor spring的TaskExecutor为在spring环境下进行并发 ...