<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滚动到顶部的更多相关文章

  1. 基于jQuery实现页面滚动时顶部导航显示隐藏效果

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...

  2. [jquery]判断页面滚动到顶部和底部(适用于手机web加载)

    //判断页面滚动到顶部和底部 $(window).scroll(function(){ var doc_height = $(document).height(); var scroll_top = ...

  3. js平滑滚动到顶部,底部,指定地方

    [原文链接] 采用锚点进行页面中的跳转的确很方便,但是要想增加网页的效果,可以使用jquery中的animate,实现滚动的一个动作,慢慢的滚动到你想跳转到的位置,从而看起来会非常高大上. [示例演示 ...

  4. js+JQuery实现返回顶部功能

    很多网站上都有返回顶部的效果,本文阐述如何使用jquery实现返回顶部按钮. 首先需要在顶部添加如下html元素: <p id="back-to-top"><a  ...

  5. jQuery滚动条回到顶部或指定位置

    jQuery滚动条回到顶部或指定位置 在很多网站,为了增强用户体验,我们会看到回到顶部的按钮,不用手动拖拽滚动条就能回到顶部,非常方便.下面就介绍用jquery实现的滚动到顶部的代码 $(functi ...

  6. JQuery 实现返回顶部效果

    首先要里了解一下几个知识 $(window).scrollTop() ---滚动条距顶部距离 fadeIn() 方法使用淡入效果来显示被选元素,假如该元素是隐藏的. fadeOut() 方法使用淡出效 ...

  7. [js常用]页面滚动的顶部,指定位置或底部,平滑滚动

    js平滑滚动到顶部.底部.指定地方 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  8. javascript+JQuery实现返回顶部功能

    很多网站上都有返回顶部的效果,本文阐述如何使用jquery实现返回顶部按钮. 首先需要在顶部添加如下html元素: <p id="back-to-top"><a ...

  9. 一款基于jquery固定于顶部的导航

    今天给大家分享一款基于jquery固定于顶部的导航,这款导航当浏览器滚动条位于顶部时,导航高度较高,当浏览器滚动向下滚动时,导航高度自动减低,并位于顶部.效果图如下: 在线预览   源码下载 实现的代 ...

随机推荐

  1. 前端性能测试工具 : dynaTrace Ajax (还没写完)

    今天开始写这个工具, #什么是dynaTrace Ajax? 随着 jQuery.Dojo.YUI 等框架的兴起让构建 Web2.0 应用更加容易,但随之带来的定位等应用问题也越来越难,尤其是与性能相 ...

  2. deepin常用软件列表

    deepin常用软件列表 软件列表 Safe Eyes 视力保护程序 网址

  3. Tomcat清理无用应用防止漏洞

    /webapps/host-manager /home/renguoqiang /webapps/manager /home/renguoqiang /webapps/host-manager rm ...

  4. Flutter 目录结构介绍、入口、自定义 Widget、MaterialApp 组件、Scaffold 组件

    Flutter 目录结构介绍 文件夹 作用 android android 平台相关代码 ios ios 平台相关代码 lib flutter 相关代码,我们主要编写的代 码就在这个文件夹 test ...

  5. ISO/IEC 9899:2011 条款5——5.1 概念模型

    5.1 概念模型 5.1.1 翻译环境 5.1.2 执行环境

  6. QThread: Destroyed while thread is still running

    Qt5已经分装了函数 void QThread::requestInterruption() { Q_D(QThread); QMutexLocker locker(&d->mutex) ...

  7. Linux记录-批量安装ssh(转载)

    首先,需要检查expect是否安装:rpm -qa|grep expect 然后,在操作机上创建公钥:ssh-keygen 一路回车即可 创建好之后到/root/.ssh/下就可以看到id开头的2个文 ...

  8. Flink 异步IO访问外部数据(mysql篇)

    接上篇:[翻译]Flink 异步I / O访问外部数据 最近看了大佬的博客,突然想起Async I/O方式是Blink 推给社区的一大重要功能,可以使用异步的方式获取外部数据,想着自己实现以下,项目上 ...

  9. vfp

    DROP 从目前资料库中移出资料表格,并从磁碟上将它删除.DELETE 标示要删除的记录.只是标记,没有删除.ZAP 从资料表格中移除所有记录,仅保留资料表格结构.PACK 从目前资料库中移除标示为删 ...

  10. Sequelize 类 建立数据库连接 模型定义

    1:Sequelize 类 Sequelize是引用Sequelize模块获取的一个顶级对象,通过这个类可以获取模块内对其他对象的引用.比如utils.Transaction事务类.通过这个顶级对象创 ...