$('#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. 老是上不了 google scholar...

    这段时间老是上不了 google scholar... 下载了最新的 host 也不行. 难道真是电脑有问题了? 网络有时也老是掉... 也好. 多休息休息. 人生难得几回清闲. 马上就要开学咯. 课 ...

  2. python开发遇到的坑(1)xpath解析ValueError: Unicode strings with encoding declaration are not supported

    Traceback (most recent call last): File "/Users/*******.py", line 37, in <module> Bt ...

  3. innobackupex的流备份【转】

    并行备份 innobackupex -p123123 --parallel= /backup 节流备份(节省IO) innobackupex -p123123 --throttle= /backup ...

  4. 【原创】大数据基础之ElasticSearch(1)简介、安装、使用

    ElasticSearch 6.6.0 官方:https://www.elastic.co/ 一 简介 ElasticSearch简单来说是对lucene的分布式封装,增加了shard(每个shard ...

  5. Python-Django 模板层

    1 模版简介 DTL:django模板语言 核心: 变量 {{ }} 标签 {% %} 2 模版语法之变量 -变量渲染:{{变量}} -变量深度查询:{{变量.索引/key值/方法}} <h2& ...

  6. appJSON["window"]["navigationBarTextStyle"] 字段需为 black 或 white

    appJSON["window"]["navigationBarTextStyle"] 字段需为 black 或 white     改动成这个就可以了 &qu ...

  7. 百度地图api文档实现任意两点之间的最短路线规划

    两个点之间的路线是使用“Marker”点连接起来的,目前还没找到改变点颜色的方法,测试过使用setStyle没有效果. <html><head> <meta http-e ...

  8. Oracle 升级的必要性

    一.Oracle 历史 Oracle database 作为Oracle 公司的商业产品,凭借其稳定性和运行高效占据了全球三成以上的市场.并且主要是金融.政府等领域. Oracle 数据库拥有近40年 ...

  9. linux基础命令学习笔记(一)

    2019年4月1日: “目录” = “文件夹” 常用命令(一): 1.ls: list 列表,默认当前文件夹的文件和目录 linux:命令+选项+参数 ls -l:长输出,列出文件的详细信息 - rw ...

  10. scrapy相关 通过设置 FEED_EXPORT_ENCODING 解决 unicode 中文写入json文件出现`\uXXXX`

    0.问题现象 爬取 item: 2017-10-16 18:17:33 [scrapy.core.scraper] DEBUG: Scraped from <200 https://www.hu ...