原生js返回顶部
let backToTop = function() {
let scrollToptimer = setInterval(function() {
let top = document.body.scrollTop || document.documentElement.scrollTop;
let speed = top / 4;
if (document.body.scrollTop !== 0) {
document.body.scrollTop -= speed;
} else {
document.documentElement.scrollTop -= speed;
}
if (top === 0) {
clearInterval(scrollToptimer);
}
}, 40);
};
原生js返回顶部的更多相关文章
- 原生js返回顶部(匀速、由快到慢)
在项目中我们经常有需求要求页面滚动到一定位置时出现返回顶部按钮,点击即返回顶部. 方法一: 锚点,这是最简单的.(a标签的href属性等于一直要到达位置元素的id值) 方法二: js直接给页面根节点设 ...
- 原生JS返回顶部,带返回效果
有些网站当滑到一定高度时右下角会有一个按钮,你只要一点就可以直接返回顶部了.那这个功能是怎么做到的呢.其实不算太难: 首先我们先在网页中创建一个按钮,上面写上返回顶部,把它的样式改成固定定位,之后想要 ...
- js返回顶部封装 简洁
js返回顶部封装 简洁: 加入html页面body最后面即可. <script> a(); function a() { $(function() { if ($(".j-to- ...
- 详解原生JS回到顶部
第一次知道可以用超链接(锚点)实现回到顶部的时候我是很震惊的,想着原来可以这么简单啊!但是作为一个正在学习JS的小白,不能就这么轻易止步,所以查资料自己整了一个JS返回顶部. HTML代码: ? 1 ...
- js返回顶部效果
当用户浏览的网页过于长的时候,用户在浏览到网页底部想要在返回顶部需要滚动好几次滚轮才能返回顶部,不仅麻烦,而且用户体验也会很差.现在的大多是页面都会在页面顶部或者是页面的可见区域的某一位置固定一个按钮 ...
- js返回顶部小Demo
<style> .divH { height: 1800px; } .divT { width: 50px; height: 50px; font-size: 18px; backgrou ...
- js返回顶部
1. function scrollTop(){ $(},); } 2. $("#side-bar .gotop").click(function(){ $(},); //返回顶部 ...
- js 返回顶部
<script> window.onload = function(){ var oTop = document.getElementById("to_top"); v ...
- 原生js回到顶部
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
随机推荐
- Nexus Repository Manager 3(CVE-2019-7238) 远程代码执行漏洞分析和复现
0x00 漏洞背景 Nexus Repository Manager 3是一款软件仓库,可以用来存储和分发Maven,NuGET等软件源仓库.其3.14.0及之前版本中,存在一处基于OrientDB自 ...
- 解题:SPOJ 422 Transposing is Even More Fun
题面 这种换来换去的东西很容易想到置换群那一套,然后题目甚至还暗示了二进制=.= 直接换的话显然是$2^{a+b}$次,但是一个循环节里可以少换一次,然后问题就变成了数循环节 在一个循环节里的位置有什 ...
- E 定向 牛客练习赛25
tarjan 父节点和子节点 #include <cstdio> #include <cstdlib> #include <cmath> #include < ...
- Scala进阶之路-Scala的基本语法
Scala进阶之路-Scala的基本语法 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.函数式编程初体验Spark-Shell之WordCount var arr=Array( ...
- oracle connect by用法篇 (转)
1.基本语法 select * from table [start with condition1] connect by [prior] id=parentid 1 2 1 2 一般用来查找存在父子 ...
- SQL语句(九)使用特殊关系运算符查询
使用特殊关系运算符查询 特殊关系运算符 IN.NOT IN IS NULL.IS NOT NULL BETWEEN.NOT BETWEEN LIKE.NOT LIKE IN , NOT IN IN 在 ...
- phpStorm 8.0.3 设置
phpstorm 8 license key Learn Programming===== LICENSE BEGIN =====63758-1204201000000Ryqh0NCC73lpRm!X ...
- Ionic -- css
Header 固定在头部,可以包含标题标签,可以有左右按钮 样式:bar bar-header bar-light 第一个小节 第二个表示的是头部 第三个表示颜色 子头部,需要在ion-content ...
- 20155222 2016-2017-2 《Java程序设计》第6周学习总结
20155222 2016-2017-2 <Java程序设计>第6周学习总结 教材学习内容总结 从应用程序的角度来看,如果要将数据从来源中取出,可以使用输入串流:如果要将数据写入目的地,可 ...
- SANS社区帐号邮件激活问题
注册时,密码需要数字,大写字母,小写字母,符号10位以上才能注册成功 吐槽:谁来爆破一下这种强度的密码,哈哈. 在我的文章中,有 计算机取证 分类,里面的一篇文章 Virtual Worksta ...