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 插件,经过自己的修 ...
随机推荐
- route 工具
route工具 route工具主要用来查看或修改内核路由表 查看内核路由表 route [-nee] 参数说明: -n:不要使用协议或主机名称,直接使用 IP 或 port number:-ee:使用 ...
- UFS 介绍 1[【转】
本文转载自:https://blog.csdn.net/u014645605/article/details/52063624 硬件架构: 接口示意图: UFS 速度和emmc的对比 UFS2.1 U ...
- 虚拟机极简配置manjaro gnome
一.安装gnome启动到桌面后,卸载所有不必要的软件,减少系统大小 打开[增加/删除软件],找到要删除的软件卸载 ms-office ---微软在线办公软件 Thunderbird ---邮箱 kon ...
- 搭建git 服务器
Gogs 什么是 Gogs? Gogs 是一款极易搭建的自助 Git 服务. https://gogs.io/docs
- [HDU 1215] 七夕节(求因子,不超时)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1215 //注意怎么处理不超时 #include<iostream> #include< ...
- jd面试之感
一面问题:问题都回答的很好,顺利进入二面 1.单点登录的改造和原理 2.hashmap 3.jvm:堆.方法区.栈,本地方法栈,gc,gc的方式 4.spring的ioc.aop的实现方式cglib和 ...
- CAS 单点登录4.24版本 登录调用其它系统并且返回客户端用其它的用户信息改造
1.登录调用其它系统.修改deployerConfigContext.xml <?xml version="1.0" encoding="UTF-8"?& ...
- Entity Framework Core一键生成实体命令
打开Vs中工具——Nug包管理器——程序包管理控制台 设置启动项目为存储实体模型的类库或控制台 Scaffold-DbContext "数据库连接字符串" Microsoft.E ...
- 3、使用keepalived高可用LVS实例演示
回顾: keepalived: vrrp协议的实现: 虚拟路由器: MASTER,BACKUP VI:Virtual Instance keepalived.conf GLOBAL VRRP LVS ...
- 下载安装tomcat和jdk,配置运行环境,与Intellij idea 2017关联
第一篇博客,最近公司要用java和jsp开发新的项目,第一次使用Intellij idea 2017,有很多地方需要一步步配置,有些按照网上的教程很快就配置好了,有的还是琢磨了一会儿,在这里做一个记录 ...