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. [SDOI2016]游戏 树剖+李超树

    目录 链接 思路 update 代码 链接 https://www.luogu.org/problemnew/show/P4069 思路 树剖+超哥线段树 我已经自毙了,自闭了!!!! update ...

  2. cumtoj 一起来选课

    一起来选课 题目地址:http://192.168.173.163/JudgeOnline/problem.php?cid=1019&pid=7 题目 明泽私立大学有n门课程提供给大一的同学来 ...

  3. Unsupervised Image-to-Image Translation Networks --- Reading Writing

    Unsupervised Image-to-Image Translation Networks --- Reading Writing 2017.03.03 Motivations: most ex ...

  4. Wijmo 2017路线图

    2016年是Wijmo团队发展和增长的另一个富有成效的一年.回顾我们2016年的路线图,您可以看到我们交付了我们承诺的一切.让我们回顾一下2016年的亮点: 我们第一个全面支持Angular 2 互操 ...

  5. 在Idea创建Spring Boot + MyBatis的web项目

    创建步骤如下 选择Spring initializr  2. 修改group 与 atifact id,点击next 3. dependencies里面选择Web->Web , SQL -> ...

  6. 批量Excel数据导入Oracle数据库

    由于一直基于Oracle数据库上做开发,因此常常会需要把大量的Excel数据导入到Oracle数据库中,其实如果从事SqlServer数据库的开发,那么思路也是一样的,本文主要介绍如何导入Excel数 ...

  7. [从零开始搭网站七]CentOS上安装Mysql

    点击下面连接查看从零开始搭网站全系列 从零开始搭网站 通过前面6章,我们买好了服务器,配置了服务器连接,服务器上配置了JDK和Tomcat,准备了域名(这个我没教,自己去阿里/百度/腾讯买,买东西我相 ...

  8. ES6中Promise的入门(结合例子)

    一.Promise的前言 解决回调地狱 //以往回调方式 函数1(function(){ //代码执行...(ajax1) 函数2(function(){ //代码执行...(ajax2) 函数3(f ...

  9. 封装微信小程序支付

    <?php /** * User: Eden * Date: 2019/3/21 * 共有内容 */ namespace Common\Service; use Think\Exception; ...

  10. 清华镜像方法更新python包

    来自:Jinlong_Xu cmd环境下执行: conda config --add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/pk ...