function top() {
let currentPosition, timer
timer = setInterval(function () {
currentPosition = document.documentElement.scrollTop || document.body.scrollTop
currentPosition -= 10
if (currentPosition > 0) {
window.scrollTo(0, currentPosition)
} else {
window.scrollTo(0, 0)
clearInterval(timer)
}
}, 1)
} top()

  

js滚动条如何缓慢的回到顶部?的更多相关文章

  1. js+css实现点击回到顶部的效果(最低兼容至ie7)

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. jq与js的写法,示例回到顶部div滚动显示隐藏

    jq:var top_icon = $('.top_icon')[0]; id写法$('#id'),类写法$('.class'),标签写法$('div') 如:join=document.getEle ...

  3. 通过HTML+CSS+Javascript实现向下滚动滚动条出现导航栏并出现回到顶部按钮点击按钮回到顶部(一)

    回到顶部实例一 效果:默认隐藏导航栏,当滚动条滚到超过300px后导航栏和按钮出现,点击回到顶部按钮回到顶部,并隐藏导航栏和按钮(导航栏和按钮都是固定定位) <!doctype html> ...

  4. 通过js实现回到顶部功能

    许多商城网址,当我们滚动到一定高度时,我们会发现一般会出现一个回到顶部的js选项,点击轻松实现回到顶部,交互效果会显得比较人性化,且回到顶部过程中若在滚动滚动条时可以停止滚动,现在让我们来实现吧 我总 ...

  5. [HTML/JS] JQuery 页面滚动回到顶部

    HTML: <html> <body> <div id="back-to-top" style="cursor:pointer; displ ...

  6. JS实现回到顶部效果

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

  7. JS回到顶部代码小记

    HTML: <div id="goTop"> <a href="#top"><img src="~/Content/th ...

  8. js——页面回到顶部

    很久都没有去慕课网学习学习了,刚恰好就看见了一个用的比较多的小例子——页面回到顶部,记得之前自己也是在初学web时,被这个坑了一回,因此今天特地拿来分享分享…… <!DOCTYPE html&g ...

  9. 一款回到顶部的 jQuery 插件,支持 Div 中的滚动条回到顶部

    前言 今天在网上搜索“回到顶部”的 jQuery 插件,网上有很多,但是大部分都不支持让 Div 中的滚动条回到顶部.于是乎,不放弃,自己参考 Github 上的一个 jQuery 插件,经过自己的修 ...

随机推荐

  1. ZOJ 4027 Sequence Swapping(DP)题解

    题意:一串括号,每个括号代表一个值,当有相邻括号组成()时,可以交换他们两个并得到他们值的乘积,问你最大能得到多少 思路:DP题,注定想得掉头发. 显然一个左括号( 的最远交换距离由他右边的左括号的最 ...

  2. C# 截取 byte 字节 转字符串

    byte[] byteArray = System.Text.Encoding.Default.GetBytes(content); Byte[] ThisByte = new Byte[1];Buf ...

  3. Balloons

    题目链接:http://acm.sdibt.edu.cn/JudgeOnline/problem.php?id=2401 类似求连通块的问题,可以参考紫书(P162 油田),对这两个人分别执行dfs. ...

  4. python时间

    #!/usr/bin/python # -*- coding: utf-8 -*- import sys import time import datetime line="Wed 11/2 ...

  5. cookie 简单用法

    cookie 简单用法 //当前登录人的组织Id HttpCookie SingleValueCookie = new HttpCookie("DepartmentId", &qu ...

  6. 小程序学习一 .json 文件配置

    微信小程序——配置 以下就是小编对小程序配置的资料进行的系统的整理,希望能对开发者有帮助. 我们使用app.json文件来对微信小程序进行全局配置,决定页面文件的路径.窗口表现.设置网络超时时间.设置 ...

  7. Hadoop 学习路线

    大数据实时计算工程师/Hadoop工程师/数据分析师职业路线图 描述 本路线图是一个专门针对大数据实时处理.Hadoop工程师和数据分析师所设计的课程体系介绍,在实时计算方向主要包括了从数据收集框架. ...

  8. Qt532界面.ZC测试

    ZC:Delphi中只要随便拖几个控件,设置一下属性就OK了.但是,Qt中 貌似没有 方便的方式来做这个... ZC:目前的解决方案是:Qt中 拖几个控件,然后点 工具条里面的 "栅格布局( ...

  9. [原][osg]Geometry详解

    //geometry成员变量 PrimitiveSetList _primitives; osg::ref_ptr<Array> _vertexArray; //顶点 osg::ref_p ...

  10. Java 8新特性探究(二)深入解析默认方法

    什么是默认方法,为什么要有默认方法 简单说,就是接口可以有实现方法,而且不需要实现类去实现其方法.只需在方法名前面加个default关键字即可. 为什么要有这个特性?首先,之前的接口是个双刃剑,好处是 ...