js滚动条如何缓慢的回到顶部?
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滚动条如何缓慢的回到顶部?的更多相关文章
- js+css实现点击回到顶部的效果(最低兼容至ie7)
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- jq与js的写法,示例回到顶部div滚动显示隐藏
jq:var top_icon = $('.top_icon')[0]; id写法$('#id'),类写法$('.class'),标签写法$('div') 如:join=document.getEle ...
- 通过HTML+CSS+Javascript实现向下滚动滚动条出现导航栏并出现回到顶部按钮点击按钮回到顶部(一)
回到顶部实例一 效果:默认隐藏导航栏,当滚动条滚到超过300px后导航栏和按钮出现,点击回到顶部按钮回到顶部,并隐藏导航栏和按钮(导航栏和按钮都是固定定位) <!doctype html> ...
- 通过js实现回到顶部功能
许多商城网址,当我们滚动到一定高度时,我们会发现一般会出现一个回到顶部的js选项,点击轻松实现回到顶部,交互效果会显得比较人性化,且回到顶部过程中若在滚动滚动条时可以停止滚动,现在让我们来实现吧 我总 ...
- [HTML/JS] JQuery 页面滚动回到顶部
HTML: <html> <body> <div id="back-to-top" style="cursor:pointer; displ ...
- JS实现回到顶部效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JS回到顶部代码小记
HTML: <div id="goTop"> <a href="#top"><img src="~/Content/th ...
- js——页面回到顶部
很久都没有去慕课网学习学习了,刚恰好就看见了一个用的比较多的小例子——页面回到顶部,记得之前自己也是在初学web时,被这个坑了一回,因此今天特地拿来分享分享…… <!DOCTYPE html&g ...
- 一款回到顶部的 jQuery 插件,支持 Div 中的滚动条回到顶部
前言 今天在网上搜索“回到顶部”的 jQuery 插件,网上有很多,但是大部分都不支持让 Div 中的滚动条回到顶部.于是乎,不放弃,自己参考 Github 上的一个 jQuery 插件,经过自己的修 ...
随机推荐
- linux服务器的所有服务web/dns/dhcp/vsftp-nfs-samba的配置
nfs是sun开发的 network filesystem 网络文件系统,相当于win的映射网络驱动器, 可以将一台nfs服务器上的目录"挂载"到本地机器上的 一个 本地目录 一样 ...
- 彻底了解 suid, sgid ,sticky权限
sticky: 粘性的, 如 : sticky tape: 粘胶带 /tmp, /var/tmp: 位 sticky: 表示: 第一, 任何用户都可以在该目录下创建文件(编辑自己的文件),第二, 但是 ...
- IDEA新建一个Project和Module的问题
- (zhuan) 一些RL的文献(及笔记)
一些RL的文献(及笔记) copy from: https://zhuanlan.zhihu.com/p/25770890 Introductions Introduction to reinfor ...
- Linux命令之du命令
du命令 显示文件或目录所占用的磁盘空间. 命令格式: du [option] 文件/目录 -h 输出文件系统分区使用的情况,例如:10KB,10MB,10GB等 -s 显示文件或整个目录的大小,默认 ...
- 【转】myeclipse 自定义视图Customize Perspective 没有反应
官网查了下,解释如下: 附上链接https://www.myeclipseide.com/PNphpBB2-viewtopic-t-30151.html,大概意思是按如下图所示步骤更新即可.读者可 ...
- Ubuntu18.04下安装MySQL
Ubuntu上安装MySQL非常简单只需要几条命令就可以完成. 1. sudo apt-get install mysql-server 2. apt-get isntall mysql-client ...
- redis简介(未完成)
redis是一个用c语言开发的一个开源的高性能键值对(key-value)数据库,基本类型: 1)字符串型 string 2)字符串列表 lists 3)字符串集合 sets 4)有序字符串集合 so ...
- Qt532界面.ZC测试
ZC:Delphi中只要随便拖几个控件,设置一下属性就OK了.但是,Qt中 貌似没有 方便的方式来做这个... ZC:目前的解决方案是:Qt中 拖几个控件,然后点 工具条里面的 "栅格布局( ...
- 剖析Hadoop和Spark的Shuffle过程差异
一.前言 对于基于MapReduce编程范式的分布式计算来说,本质上而言,就是在计算数据的交.并.差.聚合.排序等过程.而分布式计算分而治之的思想,让每个节点只计算部分数据,也就是只处理一个分片,那么 ...