纯js实现页面返回顶部的动画(超简单)


Posted in Javascript onAugust 10, 2017

废话不多说,直接上代码

var scrollTop = document.body.scrollTop;
  document.body.style.marginTop = -scrollTop + 'px';
  document.body.scrollTop = 0;
  document.body.style.transition = 'all 1s ease-in-out';
  document.body.style.marginTop = 0;
  setTimeout(function () { document.body.style.transition = 'none'; }, 1000);

以上这篇纯js实现页面返回顶部的动画(超简单)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript实现的一个随机点名功能
Aug 26 Javascript
JavaScript实现的一个计算数字步数的算法分享
Dec 06 Javascript
JavaScript去除数组里重复值的方法
Jul 13 Javascript
javascript执行环境及作用域详解
May 05 Javascript
jquery实现表格中点击相应行变色功能效果【实例代码】
May 09 Javascript
javascript动画系列之模拟滚动条
Dec 13 Javascript
用JavaScript做简易的购物车的代码示例
Oct 20 Javascript
vue.js中$set与数组更新方法
Mar 08 Javascript
详解webpack4多入口、多页面项目构建案例
May 25 Javascript
解决vue keep-alive 数据更新的问题
Sep 21 Javascript
JS apply用法总结和使用场景实例分析
Mar 14 Javascript
vue 如何从单页应用改造成多页应用
Oct 23 Javascript
基于daterangepicker日历插件使用参数注意的问题
Aug 10 #Javascript
通过示例彻底搞懂js闭包
Aug 10 #Javascript
用js屏蔽被http劫持的浮动广告实现方法
Aug 10 #Javascript
JS实现下拉菜单列表与登录注册弹窗效果
Aug 10 #Javascript
浅谈sass在vue注意的地方
Aug 10 #Javascript
详解jQuery同步Ajax带来的UI线程阻塞问题及解决办法
Aug 09 #jQuery
Angular 2.0+ 的数据绑定的实现示例
Aug 09 #Javascript
You might like
简单的php写入数据库类代码分享
2011/07/26 PHP
关于二级目录拖拽排序的实现(源码示例下载)
2013/04/26 PHP
如何使用php输出时间格式
2013/08/31 PHP
PHP数据库编程之MySQL优化策略概述
2017/08/16 PHP
PHP解决高并发的优化方案实例
2020/12/10 PHP
JavaScript脚本性能的优化方法
2007/02/02 Javascript
javascript xml为数据源的下拉框控件
2009/07/07 Javascript
JavaScript学习笔记(十七)js 优化
2010/02/04 Javascript
JavaScript入门之事件、cookie、定时等
2011/10/21 Javascript
js星星评分效果
2014/07/24 Javascript
Javascript aop(面向切面编程)之around(环绕)分析
2015/05/01 Javascript
JavaScript各类型的关系图解
2015/10/16 Javascript
js生成随机数的过程解析
2015/11/24 Javascript
jquery解析json格式数据的方法(对象、字符串)
2015/11/24 Javascript
很棒的js选项卡切换效果
2016/07/15 Javascript
jquery ajax后台返回list,前台用jquery遍历list的实现
2016/10/30 Javascript
js 实现在2d平面上画8的方法
2018/10/10 Javascript
Vue+ElementUI 中级联选择器Bug问题的解决
2020/07/31 Javascript
[02:36]DOTA2英雄基础教程 一击致命幻影刺客
2013/12/06 DOTA
利用soaplib搭建webservice详细步骤和实例代码
2013/11/20 Python
在Django的通用视图中处理Context的方法
2015/07/21 Python
对python GUI实现完美进度条的示例详解
2018/12/13 Python
Python数学形态学实例分析
2019/09/06 Python
pycharm中import呈现灰色原因的解决方法
2020/03/04 Python
Charles & Colvard官网:美国莫桑石品牌
2019/06/05 全球购物
苏格兰领先的多渠道鞋店:Begg Shoes
2019/10/22 全球购物
精彩的大学生自我评价
2013/11/17 职场文书
小学教师自我鉴定范文
2014/03/20 职场文书
教师师德演讲稿
2014/05/06 职场文书
软件售后服务承诺书
2014/05/21 职场文书
2014预备党员批评与自我批评思想汇报
2014/09/20 职场文书
毕业答辩开场白范文
2015/05/27 职场文书
庆祝教师节主持词
2015/07/06 职场文书
2016教师节感恩话语
2015/12/09 职场文书
MySQL系列之三 基础篇
2021/07/02 MySQL
苹果的回收机器人可以通过拆解iPhone获取大量的金和铜并外公布了环境保护最新进展
2022/04/21 数码科技