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. 为什么不能用drop function add 去删除函数? 因为不能使用 mysql中的保留字!

    mysql中有很多的 保留字, 也叫关键字, 你在使用 数据库中的任何东西, 都最好是 避开这些关键字/保留字, 包括 数据库名, 表名, 字段名, 函数名, 存储过程名. 这些关键字包括: mysq ...

  2. 关于link标签的用法, 不声明rel=stylesheet则无效? 在ff中必须声明rel属性!

    void 无效的, 空的; invalid: 无效的, void 和 invalid 在表示无效的时候, 是一样的, 等同的 the treaty (条约) was declared invalid ...

  3. LuoguP3948 数据结构

    题目地址 题目链接 题解 以为这题虽然是数据随机也不至于那么水吧... 于是秉着先打部分分和暴力的原则先写了暴力和min,max为-inf和inf的特殊点,对于暴力搞了个小优化,延后的操作直接前缀和答 ...

  4. .net Core 依赖注入 Add********说明

    AddTransient瞬时模式:每次请求,都获取一个新的实例.即使同一个请求获取多次也会是不同的实例 AddScoped:每次请求,都获取一个新的实例.同一个请求获取多次会得到相同的实例 AddSi ...

  5. WebLogic调用WebService提示Failed to localize、Failed to create WsdlDefinitionFeature

    在本地Tomcat环境下调用WebService正常,但是部署到WebLogic环境中,则提示警告:[Failed to localize] MEX0008.PARSING_MDATA_FAILURE ...

  6. facebook ads api

    api测试 https://developers.facebook.com/tools/explorer/517735271920003?method=GET&path=act_1107316 ...

  7. mongodb,Mysql,redis基础教程

    数据库基础 1:mongodb基础教程 1:pymongo基础教程  2:Mysql基础教程 3:redis基础教程

  8. tomcat下的server.xml详解

    说明:以下内容是自己看书时从书本上整理而来,在此记录一下,方便自己日后复习(自用),如果和网上帖子有相同,请联系本博主. server.xml文件描述了如果启动Tomcat server: <S ...

  9. hibernate的三种状态和缓存

    hibernate的三种状态: 1.瞬时态:对象里面没有id值,对象与session没有关联 类似,把class类new出来,不存进session 2.持久态:对象里面有id值,对象与session关 ...

  10. django人类可读性

    一些Django的‘奇技淫巧’就存在于这些不起眼的地方. 为了提高模板系统对人类的友好性,Django在django.contrib.humanize中提供了一系列的模板过滤器,有助于为数据展示添加“ ...