$('#backToTop').click(function(){
var dist = $(document).height() - $(window).height();
timer = requestAnimationFrame(function fn(){
if($(window).scrollTop() > 0){
//console.log($(window).scrollTop() + ':dist:'+dist);
$(window).scrollTop($(window).scrollTop()-20);
timer = requestAnimationFrame(fn);
}else{
cancelAnimationFrame(timer);
}
});
});

requestAnimationFrame移动端实现回到顶部效果的更多相关文章

  1. JS实现回到顶部效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. 用Javascript实现回到顶部效果

    用Javascript实现回到顶部效果 经常看到网页中有回到顶部的效果,今天也研究一下回到顶部有哪些方法.众所周知,用锚链接是实现回到最简单的方法,但是从用户体验效果来说,并不是最好的.(锚链接回到顶 ...

  3. javascript 特效实现(2)——回到顶部效果

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

  4. jquery实现"跳到底部","回到顶部"效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 页面滚动事件和利用JS实现回到顶部效果

    页面滚动 事件:window.onscroll, 获得页面滚动位置:document.body.scrollTop: HTML代码: 这里注意此处逻辑,大于500就显示,否则就隐藏,还有注意如果变量名 ...

  6. jQuery写toTop(回到顶部)效果

    在通常的网站开发中,页面有时候会很长,尤其是一些电商网站,为了提高用户的体验效果,我们通常会增加一个回到顶部的按钮,这个按钮我们同城会使用fixed定位,将其定位在当前可视区域某一固定位置.这个效果用 ...

  7. javascript 回到顶部效果的实现

    demo.js window.onload=function() { var timer=null; var obtn=document.getElementById('btn'); var isTo ...

  8. JS原生回到顶部效果

    // 回到顶部 onload = function () { var oBtnTop = document.getElementById('toTop'); var timer = null; oBt ...

  9. 自写jquery网页回到顶部效果,渐隐图标,引用js文件就可以

    唔.进来开发需求,当网页内容草鸡多的时候,用户就须要有个button高速回到顶部,而不是自己去滚滑轮~ 原本以为比較难的说,由于上头要求所实用js来实现,哪个页面引用,哪个页面显示. 于是乎,本屌丝就 ...

随机推荐

  1. Elasticsearch High Level Rest Client 发起请求的过程分析

    本文讨论的是JAVA High Level Rest Client向ElasticSearch6.3.2发送请求(index操作.update.delete--)的一个详细过程的理解,主要涉及到Res ...

  2. mac下go环境搭建开发web工程

    1,golang下载: http://www.golangtc.com/download https://golang.org/ https://beego.me/docs/intro/ 2,安装go

  3. keras系列︱Sequential与Model模型、keras基本结构功能(一)

    引自:http://blog.csdn.net/sinat_26917383/article/details/72857454 中文文档:http://keras-cn.readthedocs.io/ ...

  4. django上下文处理器的基本使用

    1.定义一个方法 2.在django里面的settings.py里面修改配置文件 3.最后在模板里面调用 操做步骤如下: 这是在settings.py里面配置的文件   在模板里面调用上下文处理器

  5. 模组 前后端分离CURD 组件

    js (function () { // {# -------------------------------------------------------------------------- # ...

  6. spring cloud 微服务调用--ribbon和feign调用

    这里介绍ribbon和feign调用两种通信服务调用方式,同时介绍如何引入第三方服务调用.案例包括了ribbon负载均衡和hystrix熔断--服务降级的处理,以及feign声明式服务调用.例子包括s ...

  7. java.lang.NoClassDefFoundError: org/apache/commons/lang3/StringUtils

    ♦ 问题所在:项目lib包里少一个jar包 ♦ 解决办法: commons-lang3-3.1.jar 导入到项目就ok

  8. 将.NET Core部署在Docker

    转载自:ASP.NET Core 2.1 使用Docker运行 1.新建ASP.NET Core项目 新建一个名为“DockerSample”的ASP.NET Core项目 运行程序,页面如下: 2. ...

  9. c++ explicit 构造函数

    代码 #include<iostream> using namespace std; class Example { private: int data; public: Example( ...

  10. Git一些简单但非常重要并常用的操作命令

    1.将本地与github进行关联配置 生成公钥 ssh-keygen -t rsa -C "jiasheng.mei@hpe.com" 将公钥拷贝到github中 在公钥同文件夹( ...